Question

我的网站标题部分有一个jQuery图像滑块，可以自动滑动动作定期显示图像。现在的问题是当你第一次加载页面时（没有缓存），它会立即加载滑块中的所有图像，并将图像一个在另一个上面对齐在网页上（一个div在另一个上面）），所以你在页面加载的那一刻就可以看到所有的图像。我的网站：www.mrsinghcafe.com/league /

HTML

<div id="menu">
    <a href="javascript:void(0);"><img src="img/image-1.jpg" title="Lorem ipsum dolor sitamet conse ctetu" alt="image1" /></a>
    <a href="javascript:void(0);"><img src="img/image-2.jpg" title="Sed do eiusmod tempor incididun" alt="image2" /></a>
    <a href="javascript:void(0);"><img src="img/image-3.jpg" title="Duis aute irure dolor in reprehenderit" alt="image3"/></a>
    <a href="javascript:void(0);"><img src="img/image-4.jpg" title="Voluptate veldolor sit amet conse ctetu" alt="image4" /></a>
    <a href="javascript:void(0);"><img src="img/image-5.jpg" title="Ipsum dolor sit amet conse ctetu" alt="image5" /></a>
</div>

我正在使用此轮播http://dev7studios.com/plugins/caroufredsel/

Answer 1

图像不会被CSS隐藏，所以它们会一直显示，直到JS在页面加载时启动。

您可以将所有元素放在同一个地方，这就是轮播插件正在做的事情。

'position: absolute; z-index: 0; display: block;'

所以在style.css中你要添加

#menu{
    position:relative; /* this constrains any child elements whose position is absolute */
}

#menu a{
    position:absolute;
    top:0;
    left:0;
}

html网站中的jQuery图像滑块暂时加载所有图像

1 个答案: