2009-11-14 43 views
1

我有一個jQuery可調整大小的插件的問題。我遇到了麻煩,並且提出了這個問題。如果我創建一個div並使其可調整大小,並使它也具有一個alsoResize,它可以在大多數情況下正常工作。但是,如果我將第二個div也設置爲margin:0 auto,它將無法正常工作。鼠標光標從您調整其大小的部分脫落。所以這是我談論的例子:jQuery的可調整大小的光標不與邊緣自動調整

<div id="container"> 
    <div id="inside" style="margin:0 auto;"> 
    </div> 
</div> 

jQuery的:

$("#container").resizable({ alsoResize:"#inside" }); 

如果我拿出的保證金自動它工作正常,但它在那裏它不是工作。有沒有辦法使這項工作或只是另一種方式來居中頁面而不使用自動?

+0

任何人都知道如何解決這個問題? – ngreenwood6 2009-11-14 22:08:36

回答

1

我抓住了一個Resizeable插件的演示代碼,並調整它來做我認爲你要完成的任務。如果不是,請提供一個鏈接,你有什麼,或在整頁粘貼:

<!doctype html> 
<html lang="en"> 
<head> 
    <title>jQuery UI Resizable - Default functionality</title> 
    <link type="text/css" href="http://jqueryui.com/themes/base/ui.all.css" rel="stylesheet" /> 
    <script type="text/javascript" src="http://jqueryui.com/jquery-1.3.2.js"></script> 
    <script type="text/javascript" src="http://jqueryui.com/ui/ui.core.js"></script> 
    <script type="text/javascript" src="http://jqueryui.com/ui/ui.resizable.js"></script> 

    <link type="text/css" href="http://jqueryui.com/demos/demos.css" rel="stylesheet" /> 
    <style type="text/css"> 
     #container { width: 150px; height: 150px; } 
     #container #inside { height:100px; width:100px; margin:0 auto; background:#eee; } 
    </style> 
    <script type="text/javascript"> 
    $(function() { 
     $("#container").resizable({ alsoResize:"#inside" }); 
    }); 
    </script> 
</head> 

<body> 
    <div class="demo"> 
     <div id="container" class="ui-widget-content"> 
      <div id="inside"></div> 
     </div> 
    </div> 
</body> 

僅供參考 - 我只是在Firefox和Safari在Mac上測試了這一點。

+0

好吧,那怎麼解決我的問題呢。這正是我所擁有的,當您移動光標時,它不會停留在容器的側面。 – ngreenwood6 2009-11-15 01:09:43

+0

對不起。我無法看到電腦上發生了什麼。我在Mac和Firefox上測試了這些代碼,並且它可以正常工作。如果您真的有興趣解決您的問題,也許您可​​以提供更多信息。 (即:哪些瀏覽器發生這種情況?提供屏幕截圖) – 2009-11-15 14:26:58