CodingForums.com

CodingForums.com (http://www.codingforums.com/index.php)
-   JavaScript programming (http://www.codingforums.com/forumdisplay.php?f=2)
-   -   Simple Slideshow keeps flickering between slides..? (http://www.codingforums.com/showthread.php?t=285858)

BlackReef 01-16-2013 01:24 AM

Simple Slideshow keeps flickering between slides..?
 
***Issue has been resolved****


You can view the slideshow here:

http://tinyurl.com/cg7mrm9

It appears fine at first, but after awhile - the slides start 'flickering' back and forth.

Here is the code:

Code:

<style>
.fadein { position:relative; width:990px; height:335px; }
.fadein img { position:absolute; left:0; top:0; }

</style>

<script>
$(function(){
    $('.fadein img:gt(0)').hide();
    setInterval(function(){
      $('.fadein :first-child').fadeOut()
        .next('img').fadeIn()
        .end().appendTo('.fadein');},
      4500);
});
</script>


<div id="content" style="background:#540000;">
        <div id="homeFlash" style="background:#540000;">

<div class="fadein">

(image paths - removed)

</div>


sunfighter 01-16-2013 05:41 PM

I have run this in FireFox ver 18 for over an hour and do not see the behavior your talking about. What browser and ver is giving you the trouble?

BlackReef 01-16-2013 09:45 PM

Yea, Im not quite sure how to replicate it, but it's happened on several differnt computers here in the office. It for sure happened on Firefox and Chrome, not sure about IE

rnd me 01-17-2013 12:29 AM

i would use CSS instead of jQuery to do the animation: it runs on a lower lever and is typically MUCH smoother than the setTimout-based animation jQuery does...

all you need are some CSS transitions.

BlackReef 01-17-2013 09:06 PM

Quote:

Originally Posted by rnd me (Post 1306749)
i would use CSS instead of jQuery to do the animation: it runs on a lower lever and is typically MUCH smoother than the setTimout-based animation jQuery does...

all you need are some CSS transitions.

Thanks for the reply. My concern is older browsers not being able to view a CSS3 slideshow. Plus this code is almost there, I think a quick change can fix this.

I dont know how to replicate the issue, but here is what is happening:

BTW - is there a way to embed YouTube videos on here? Here is the link:

http://www.youtube.com/embed/lPGs8hmKYEk

[youtube_browser]lPGs8hmKYEk[/youtube_browser]

BlackReef 01-17-2013 11:48 PM

I tried a different script, and it appears to be working fine now.

Thanks for your help guys,
-J


All times are GMT +1. The time now is 03:22 AM.

Powered by vBulletin®
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.