0

I am using this plugin: http://slidesjs.com/

When I load my website: http://26splitrockcove.com/ in Firefox, this slideshow loads and works perfectly as it should. However when I load this website in Chrome or Safari it doesn't show anything, not even the preloading image, however it will soon show the slides, however it always waits until the last (or third) image in the slideshow, then when it transitions the transitions aren't how they should be.

Now, the really weird thing is that this only happens when you reload the page using the reload button, however if you click on the url and hit enter, in both Safari and Chrome - it works perfectly.

This is my javascript for it:

$(function(){
        $('.home .slides').slides({
            preload: true,
            preloadImage: 'assets/loading.gif',
            autoHeight: true, //before I used this, it didn't even show the third image at all
            play: 5000,
            slideSpeed: 1000,
            effect: 'slide',
            pagination: false,
            generatePagination: false,
            pause: 150,
            hoverPause: true
        }); 

});
4

1 回答 1

1

我看了你的标记，看起来你忘记了一些 div/类。

你的代码：

<div class="slides">
    <div class="slideshow">
        <img src="photos/510ad67ebdf9c_thumb.jpg"/>
        <img src="photos/510ad71697e59_thumb.jpg"/>
        <img src="photos/510ad697b3734_thumb.jpg"/>
    </div>
</div>

你应该拥有的：

<div class="slides">
    <div class="slides_container">
        <div>
            <img src="photos/510ad67ebdf9c_thumb.jpg"/>
        </div>
        <div>
            <img src="photos/510ad71697e59_thumb.jpg"/>
        </div>
        <div>
            <img src="photos/510ad697b3734_thumb.jpg"/>
        </div>
    </div>
</div>

幻灯片 js javascript 查找“slides_container” div，然后根据它包含的 div 设置幻灯片。

资料来源：slidesjs.com

于 2013-02-01T17:51:23.990 回答