Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Apr 2010
    Posts
    216
    Thanks
    116
    Thanked 1 Time in 1 Post

    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>
    Last edited by BlackReef; 01-17-2013 at 11:49 PM.

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,175
    Thanks
    23
    Thanked 601 Times in 600 Posts
    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?

  • Users who have thanked sunfighter for this post:

    BlackReef (01-16-2013)

  • #3
    Regular Coder
    Join Date
    Apr 2010
    Posts
    216
    Thanks
    116
    Thanked 1 Time in 1 Post
    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

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,335
    Thanks
    11
    Thanked 588 Times in 569 Posts
    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.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • Users who have thanked rnd me for this post:

    BlackReef (01-17-2013)

  • #5
    Regular Coder
    Join Date
    Apr 2010
    Posts
    216
    Thanks
    116
    Thanked 1 Time in 1 Post
    Quote Originally Posted by rnd me View Post
    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]

  • #6
    Regular Coder
    Join Date
    Apr 2010
    Posts
    216
    Thanks
    116
    Thanked 1 Time in 1 Post
    I tried a different script, and it appears to be working fine now.

    Thanks for your help guys,
    -J


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •