gpt4 book ai didi

jQuery UI div 拖到其他 div 后面

转载 作者:行者123 更新时间:2023-12-01 05:55:06 28 4
gpt4 key购买 nike

我的页面有两列(div),第一个有一个div列表,需要拖动到第二个div,但div总是消失在第二个div后面...尝试z-index但没有成功...

使用克隆助手它可以工作,但我不想使用它,因为我想确保只拖动它一次......

我已经搜索了很多,但似乎找不到解决方案...可能缺少细节...

谢谢!

代码:

<html>
<head>
<script src="scripts/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<style type="text/css">
.columns{width: 45%;
height: 100%;
float: left;
overflow: auto;}

#col2{border-left: 1px solid black;}

.detailStyle{font-weight: bold;}

.detailSimple{list-style: inside;
font-weight: normal;}

.zeroSimple, .zeroStyle, .noImage{font-style: italic;
font-weight: normal;
color: #900;}

.disabled{ text-decoration: line-through;
color: #CCC;}

#dropit{ background-color: #DDD;
border: 2px #CCC dotted;
width: 95%;
height: 50%;}

#dropit #title{color: #CCC;
}

</style>
</head>
<body>
<div id="col1" class="columns">
<h3>divs</h3>
</div>
<div id="col2" class="columns"><h3>Add</h3>
<div id="dropit"><div id="title">DRAG AND DROP HERE</div></div>
</div>
<script language="javascript">
$(function() {

function getProductStyles(){
for(i=0;i<1000;i++){
div = $('<div/>', { id: "div"+i, html: "div: "+i});
div.draggable({containment: "document", zIndex:1000, scroll: false , appendTo: "body", revert: "invalid", revertDuration: 100, cursor: "pointer"});
$('#col1').append(div);
}
}

getProductStyles()

});
</script>
</body>
</html>

最佳答案

我不知道你的拖放功能是否已经正常工作,但是可拖动消失在右列后面的问题是你的 css #col2 中的问题:

overflow: auto;

我创建了一个 fiddle here没有溢出。

关于jQuery UI div 拖到其他 div 后面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16591784/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com