Jump to content

Slide Show Acting Up


DizzyDan

Recommended Posts

I am working on a website for a friend and there is a simple slide show on the homepage which is www.aliciamcardlephotograpy.com She tells me she and a few friends have seen it run through all of the slides and then start from the beginning and works fine. I have yet to see it. So, what i did for now was remove a bunch of slides so there are only 5 now (there was 20) and I compressed the pictures a little bit thinking maybe its because of the downloading the images. I updated the file jQ file as well. Any of you javascript doctors know whats going on here? Script

<!-- Slide Show Script --><script type="text/javascript" src="/jquery-1.2.6.min.js"></script><script type="text/javascript">function slideSwitch() {    var $active = $('#slideshow IMG.active');    if ( $active.length == 0 ) $active = $('#slideshow IMG:last');    // use this to pull the images in the order they appear in the markup    var $next =  $active.next().length ? $active.next()	    : $('#slideshow IMG:first');        // var $sibs  = $active.siblings();    // var rndNum = Math.floor(Math.random() * $sibs.length );    // var $next  = $( $sibs[ rndNum ] );    $active.addClass('last-active');    $next.css({opacity: 0.0})	    .addClass('active')	    .animate({opacity: 1.0}, 1000, function() {		    $active.removeClass('active last-active');	    });}$(function() {    setInterval( "slideSwitch()", 5000 );});</script><!-- End Slide Show Script -->

HTML

<div id="slideshowwrap">                <div id="slideshow">                    <img src="slideshow/1.jpg" alt="Image 1" class="active" />                    <img src="slideshow/2.jpg" alt="Image 1" />                    <img src="slideshow/3.jpg" alt="Image 1" />                    <img src="slideshow/4.jpg" alt="Image 1" />                </div>            </div>

Link to comment
Share on other sites

since you are the one with issues when viewing, could you elaborate on the browser you are using, and if you are seeing any errors in your console? And specifically what is happening for you that shouldn't be? Slideshow not wrapping, not moving to next image, etc? you know you don't have to start variable name with a $, right? You should only have to do this: var active = $('#slideshow IMG.active'); the $ in this context if for when you want to use something within the jquery context in order to pass it selectors, or elements that you want to call jquery methods on. edit: man, doing code snippets on this udpated version of the forum is kinda wonky... edit edit: also, I would consider just passing a reference to the function for setInterval, and without wrapping it in a jquery selector.

setInterval(slideSwitch, 5000);

Link to comment
Share on other sites

At first I could not see what the problem was, Until i tested in IE (surprise, surprise), its a bit slow loading the images, and you catch glimpses of the other images as the page loads, best option is to set all the images to display: none #slideshow img {display:none;}then use#slideshow img.active {display:block;}this will help as the images will load, but will be hidden completely from view with only the first image with class .active showing.The other problem is still image size, most images in slide show are usually between 50 to 100kb, sometime the first image, because its the first to be seen by the user would be slightly above this at 100 to 150kb.

Link to comment
Share on other sites

Sorry, i use win7 64bit and firefox and tested in IE, chrome, safari also tested on an XP machine and all was fine. I never saw this happen but the client had. From her explanation i got that it would cycle through the slideshow fast then start from the beginning and be fine. My take was that as the images download you would catch a glimpse and then once finished downloading it would be fine. She uses IE. I am not very javascript savvy, i dabble a bit but here i kind of followed along with a tutorial, then made it work for my use and thought i had it all figured out! I think dsonesuk's display suggestion will the perfect fix, in this case. in fact its genius! hah. The pics are around 200kb - 300kb i did mention that to her but she wanted to keep the quality high.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...