HTML / Javascript-位置不一致

Question

我正在设计此网站http://www.parisgaa.org/parisgaels时遇到问题。

主页上的图像滑块有时会弄乱。 在大多数情况下，它可以正常工作并且看起来不错，但在其他情况下，它的位置似乎混乱了，它出现在应该位于其下方的内容之下（即该内容与图像重叠）。 您应该能够在Chrome中复制它-只需刷新几次即可。

我将不胜感激。

Answer 1

尝试使图像滑块的位置相对：

style = "position:relative;"

Answer 2

您将必须在滑块文件中编辑一行

js/slider.js



.wrap('<div class="bx-window" style="width:'+childrenMaxWidth+'px; height:'+wrapperHeight+'px; position:relative; overflow:hidden;"></div>')
            .css({
              height: '999999px',
              position: 'relative',
                top: '-'+(origTop)+'px'
            });

在他的范围内，您需要定义一个适合图像的高度，例如

.wrap('<div class="bx-window" style="width:'+childrenMaxWidth+'px; height:400px; position:relative; overflow:hidden;"></div>')
            .css({
              height: '999999px',
              position: 'relative',
                top: '-'+(origTop)+'px'
            });

问题不在于您的实现，而在于您使用的脚本。 您可以尝试使用其他脚本，但希望此调整可以帮您解决问题！

Answer 3

您使用的用于图像滑块的jQuery插件似乎都可能有问题。 .bx-window元素的高度由于某些原因未正确评估（对我来说，它的范围为20-30px，而不是420px）。 我会尝试使用其他滑块（那里有大量的jQuery图像滑块，只是在Google上搜索），但是如果这不是一个选择，则自己在其代码中进行修复可能很简单。 祝好运！