jQuery UI可调整大小根本不起作用
jQuery UI可调整大小根本不起作用
提问于 2010-02-12 07:56:56
这就是问题所在。可调整大小的jQuery在此页面上不起作用：click here
在左上角的灰色框上试试。
我想要做的是让shoutbox的大小合适。但是它不起作用，所以我尝试将jQuery UI示例页面中的所有内容复制到我的示例页面中，并尝试使用它。所以我用同样的方式添加了灰色的方框，甚至使用了相同的css，但它不起作用。
下面是如何调用这些库的：
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.4.1");
google.load("jqueryui", "1.7.2");
google.setOnLoadCallback(function() {
});
</script>
<script type="text/javascript" src="js/thickbox.js"></script>
<script type='text/javascript' src='js/jqueryEasingMin.js'></script>
<script type='text/javascript' src='js/jquery.imghover-1.1rc.js'></script>
<script type="text/javascript" src="js/shoutbox.js" ></script>
<script type="text/javascript" src="js/bbcode.js" ></script>
<script type='text/javascript' src='js/jqueryLoader2.js'></script>文档就绪函数中的脚本(如示例所示)：
$('#resizable').resizable();灰色框的CSS：
<style type="text/css">
#resizable { width: 100px; height: 100px; background: silver; position:relative; z-index:15;}
</style>我不得不添加位置和z-index参数，因为我的网站的设计，但这似乎没有任何影响。
和实现：
<div id="resizable"></div>我想我在这里遗漏了一些非常明显的东西，但我看不到。我甚至尝试过将jquery UI库链接到本地目录，而不是使用google的库。
我真的很感激在正确的方向上点头。谢谢
回答 2
Stack Overflow用户
发布于 2012-07-05 15:01:39
在构建自定义下载时，必须包含jquery-ui提供的css。你可以在jquery-ui-1.8.21.custom\css\ui-lightness\jquery-ui-1.8.21.custom.css中找到css文件(如果你选择了lightness theme)。下面是可调整大小的css：
.ui-resizable { position: relative;}
.ui-resizable-handle { position: absolute;font-size: 0.1px; display: block; }
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; }
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; }
.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; }
.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; }
.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }
.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}Stack Overflow用户
发布于 2013-05-17 20:16:21
尝试添加以下内容：
<div id="resizable" class="ui-widget-content">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/2248689
复制相关文章
相似问题