让孩子DOM元素进行HTML和JavaScript父DIV的边界上徘徊

这是很难的标题来概括的问题到底是什么这里这么详细信息...让孩子DOM元素进行HTML和JavaScript父DIV的边界上徘徊

我有一个形象-gallery由包含图像的列表元素（以及用于显示文本标签的跨度）组成。 HTML布局是这样的：

  <div class="caracteristics_list gallery"> 

       <ul class="thumb"> 
        <li><a href="#"><span class="video">Play</span><img src="images/gallery1.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery1.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery1.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery2.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery2.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery2.jpg" alt="" /></a></li> 
        <li><a href="#"><span class="tagline">Lorem ipsum</span><img src="images/gallery3.jpg" alt="" /></a></li> 
        <li><a href="#"><span class="tagline">Lorem ipsum</span><img src="images/gallery3.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery3.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery3.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery4.jpg" alt="" /></a></li> 
        <li><a href="#"><img src="images/gallery4.jpg" alt="" /></a></li> 
       </ul>      
      </div>

这个画廊有放大效应（taken from this guide（demo））

这里美中不足的是，画廊有一个固定的宽度和高度和overflow: scroll（它不会增长，它包含在该图库div的范围内）。

这意味着，缩放效果会被溢出CSS设置截断。

我现在有一个例子（虽然有破碎的图像）can be seen on jsfiddle here。

我担心溢出约束会使这个方法变得不可能，除非我把图元从图库div中取出，并将它完全放在相同的位置，绝对或相对位置。

但首先我想确保这是唯一的出路。你有什么想法吗？

来源

2011-07-01 Sander

不要取出图像，复制它并显示出div。在需要关闭时销毁对象

来源

2011-07-01 14:32:55 hungryMind

这实际上是我需要做的但由于时间不足，我们决定更改已溢出的div，现在它有足够的填充，而不是覆盖项目在它后面。因为我们没有无尽的高度（有限的项目）的问题，我们没有滚动的问题，其中一个项目将是一半可见或再次在底部覆盖。所以你的解决方案实际上是正确的，但我们选择了一种适用于我们情况但不适用于任何情况的肮脏解决方案。谢谢 – Sander

让孩子DOM元素进行HTML和JavaScript父DIV的边界上徘徊

回答

相关问题