禁用拖放div滚动
禁用拖放div滚动
提问于 2015-03-10 09:14:12
我有一个可拖的div。当我拖动它接近网页的边缘之一，整个网站滚动。我可以禁用这个功能吗？(我基本上可以使用div来移动网页，但我希望它仅限于我目前所在的位置)，我使用jquery可拖式脚本！
标题：
link href="stilmallaudioplayer.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<style>
</style>
<script>
$(function() {
$( "#audioplayer" ).draggable();
});
</script>身体：
<div id="audioplayer" class="ui-widget-content">
<audio controls class="ui-widget-content">
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>注意:这不是我的完整代码，只是可拖的div部分！
css：
#audioplayer {
padding: 0.5em;
z-index: 3;
position: absolute;
top: 100px;
left: 100px;
}回答 2
Stack Overflow用户
回答已采纳
发布于 2015-03-10 09:20:30
您可以在overflow:hidden上设置body，也可以在拖动start上设置容器元素，然后在拖动stop时删除它：
联署材料：
$("#audioplayer").draggable({
start: function (event, ui) {
$('body').addClass("overflow");
},
stop: function (event, ui) {
$('body').removeClass("overflow");
}
});CSS：
overflow{overflow:hidden;} //Use inline style or !important if other css overrides thisStack Overflow用户
发布于 2015-03-10 09:33:39
这似乎很有效：小提琴
jQuery
$(function () {
$("#audioplayer").draggable(
{ containment: "html", scroll: false }
);
});CSS
html, body {
height:100%;
overflow:hidden;
}
#audioplayer {
padding: 0.5em;
z-index: 3;
position: absolute;
top: 100px;
left: 100px;
border: 1px solid black;
height:20px;
width: 100px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28959813
复制相关文章
相似问题
腾讯云开发者
