5

如何删除可调整大小元素的默认southeast (se)句柄图像并添加我自己的图像?

4

9 回答 9

13

我总是在我的 .css 文件中这样做

.ui-dialog .ui-resizable-se {
    background-image: url("");
}

它一直有效:)

于 2012-07-23T10:11:47.243 回答
3

你有两个选择:

  1. 您可以覆盖ui-resizable-handle或在最底部的 jQuery 站点ui-resizable-se上提到。
  2. 您可以更改图像文件“ui-icons_222222_256x240.png”,其示例由 Google 托管在此处
于 2012-05-29T15:05:47.853 回答
3

您还可以在 resizable() 中指定您想要的句柄,例如仅用于“e”句柄

$("#id").resizable({
    handles: "e"
});

http://api.jqueryui.com/resizable/#option-handles

于 2015-07-18T14:03:17.070 回答
3

您也可以在“创建”选项中解决此问题:

$('#element').resizable({
   create: function(event, ui) {
     $('.ui-icon-gripsmall-diagonal-se').remove();
   }
})
于 2015-09-09T21:58:30.857 回答
1

在带有 class 的 div 中ui-resizable,您需要将 div 的背景图像替换为 classui-icon-gripsmall-diagonal-se

您可以执行以下操作:

$(".ui-icon-gripsmall-diagonal-se").css("background-image", "url(someImage.png)")
于 2012-05-29T15:04:56.627 回答
0

这篇文章中的说明对我有用:

http://forum.jquery.com/topic/how-to-make-the-se-grip-handle-larger-for-a-jquery-ui-resizeable

使用这个 CSS:

.ui-widget-content .ui-icon.ui-icon-gripsmall-diagonal-se {
      width: 32px;
      height: 32px;
      background: url(<insert your image url here>) left top no-repeat;
}
于 2014-07-22T17:41:35.007 回答
0

我希望这对你有用:

.ui-resizable-handle { 
    z-index: auto !important;
    background-image: url('');
 }

如果您需要完全删除手柄图标,只需将背景图像设置为无。

.ui-resizable-handle { 
    background-image: none;
 }
于 2015-09-14T06:30:03.043 回答
0
$('.ui-icon-gripsmall-diagonal-se').css("background-image", "url('')");
于 2020-03-06T08:18:47.667 回答
-1

我删除了调整大小的句柄,像这样永久改变 css:

<style>
   .ui-icon, .ui-widget-content .ui-icon
   {
      background-image : none;
   }
</style>

这个对我有用。

于 2015-01-05T07:28:10.363 回答