错误在jQuery UI的可拖动

我不知道如何解决，但看看这个： enter image description here 错误在jQuery UI的可拖动

当我拉向右或向下，则有滚动条。这里是代码：

$(this).draggable({ 
    stack: ".window", 
    containment: "document", 
    scroll: false, 
...

HTML代码：

<!DOCTYPE HTML> 
<html lang="en-US"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Inteli Mirgo windows</title> 
    <link rel="stylesheet" type="text/css" href="styles/default/style.css" media="all" /> 
    <link rel="stylesheet" type="text/css" href="styles/default/mirgo.css" media="all" /> 
    <link rel="stylesheet" href="styles/default/jquery.ui.all.css"> 
    <script src="scripts/jquery-1.6.2.js"></script> 
    <script src="scripts/jquery.ui.core.js"></script> 
    <script src="scripts/jquery.ui.widget.js"></script> 
    <script src="scripts/jquery.ui.mouse.js"></script> 
    <script src="scripts/jquery.ui.draggable.js"></script> 
    <script src="scripts/jquery.ui.resizable.js"></script> 
    <script src="scripts/jquery.ui.droppable.js"></script> 
    <script src="scripts/default/mirgo.js"></script> 
</head> 
<body> 
    <div class="window optionResizable" style="width: 300px; height: 200px; left: 150px; top: 160px;"> 
     <div class="titleWindow"> 
      Window #1 
     </div> 
     <div class="bodyWindow"> 
      Content of window #1 
     </div> 
    </div> 
    <div class="window optionResizable" style="width: 200px; height: 100px; left: 300px; top: 140px;"> 
     <div class="titleWindow"> 
      Window #2 
     </div> 
     <div class="bodyWindow"> 
      Content of window #2 
     </div> 
    </div> 
    <div class="window optionResizable" style="width: 500px; height: 500px; left: 600px; top: 20px;"> 
     <div class="titleWindow"> 
      Window #3 
     </div> 
     <div class="bodyWindow"> 
      Content of window #3 
     </div> 
    </div> 
</body> 
</html>

CSS：

* { 
    margin: 0; 
    padding: 0; 
} 
body { 
    background: url('images/bg.png'); 
    font-family: sans-serif; 
    font-size: 13px; 
} 
.window { 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    background: #fff; 
    position: absolute !important; 
    border: 1px solid #CFCFCF; 
    -webkit-box-shadow: 1px 1px 5px 0px #BBBBBB; 
    -moz-box-shadow: 1px 1px 5px 0px #BBBBBB; 
    box-shadow: 1px 1px 5px 0px #BBBBBB; 
} 
...

我不知道为什么会这样，我怎么能解决这个问题？

P.S. 我试图使用containment: "body"，但在Firefox中不起作用。

我添加了新的div <div id="wow">test</div>这是标准的div没有任何CSS和改变JS到：$('#wow').draggable({stack: "#wow",containment: "document",scroll: false});和相同的效果！再次滚动条:(

来源

2011-10-26 Mirgorod

抛在那里AA通用'div'和包含内...看看会发生什么。 – Jack

这不是jQuery的用户界面的问题，这是CSS

试试这个：

body{ 
overflow: hidden; 
}

来源

2011-10-26 16:40:02 HerrSerker

谢谢，它的工作原理！ – Mirgorod

辉煌！你怎么弄出来的？这让我疯了，最终我最终用'containment：html'。谢谢！ – Dom

错误在jQuery UI的可拖动

回答

相关问题