这似乎是一个常见的问题,但出于某种原因,我根本无法想到解决方案。
我正在构建一个需要拖放功能的网站。但是,滑块内有多个项目。显然,滑块内有overflow hidden
和relative positioning
,因此幻灯片可以正常工作。
这两个属性的组合意味着当从div拖动图像时,它会被溢出切断。如果没有相对定位,则溢出不会影响拖动的元素。
但是,我很确定每个滑块/滑块都有相对定位以及隐藏溢出,因为它们需要正常工作。
但是,有人能想到解决方案吗?
Here's a reduced test case for the site。我没有包含滑块js,但是有位置/溢出的基本css用于显示问题。
对于那些希望检查代码的人,我使用的滑块是swipe.js。
从.items
.item
和.site-wrap
移除位置会向您显示拖放功能如何与overflow: hidden
一起使用。
[编辑]
我注意到jQuery UI一旦开始被拖动就会向元素添加一个类。我开始考虑是否有办法锁定它以改变该特定元素的溢出值。但是将其更改为overflow: none
似乎没有做任何事情,问题似乎与两个父元素有关,当然不能改变,因为用户可以拖放多个项目。