www.webdeveloper.com
Results 1 to 2 of 2

Thread: fading script I've written, Has some bugs

  1. #1
    Join Date
    Jun 2008
    Posts
    136

    fading script I've written, Has some bugs

    Hi,

    I've written this script which fade one div out, and makes the second div appear next and so on.

    sometimes after one div is fading out, nothing appears next. I don't know what is the bug that cause this. Specially it gets more buggy when there are <marguee> in the page or some ajax codes running also. it confuses a lot

    i'd really appreciate if someone could take a look at it :



    Code:
    <input type="hidden" id="to_fade" value="1" /><input type="hidden" id="how_many" value="5'" />   <-- how many objects are total
    <script type="text/javascript">
    	function stop_it(which_one)
    {
    	clearInterval(which_one);
    }
    
    function go_fade()
    {
    	my_interval = setInterval ('fade_it()', 2 );
    }
    
    function fade_it()
    {
    		which_one = document.getElementById('to_fade').value;
    		actual_number = parseInt(which_one);
    		next_number = actual_number + 1 > document.getElementById('how_many').value? 1 : actual_number + 1;
    		itsop = document.getElementById('sub' + which_one).style.opacity;
    		itsop = parseFloat(itsop);
    		itsop -= 0.01;
    		document.getElementById('sub' + which_one).style.opacity = itsop;
    		document.getElementById('sub' + which_one).style.filter = 'alpha(opacity=' + itsop*100 + ')';
    		if ((parseInt(document.getElementById('sub' + which_one).style.opacity * 100))/100 == 0)
    		{
    			stop_it(my_interval);
    			document.getElementById('sub' + which_one).style.display = 'none';
    			document.getElementById('sub' + next_number).style.display = 'block';
    			document.getElementById('to_fade').value = next_number;
    			my_interval2 = setInterval ('show_it()', 5 );
    		}
    }
    function show_it()
    {
    		which_one = document.getElementById('to_fade').value;
    		itsop = document.getElementById('sub' + which_one).style.opacity;
    		itsop = parseFloat(itsop);
    		itsop += 0.01;
    		document.getElementById('sub' + which_one).style.opacity = itsop;
    		document.getElementById('sub' + which_one).style.filter = 'alpha(opacity=' + itsop*100 + ')';
    		if ((parseInt(document.getElementById('sub' + which_one).style.opacity * 100))/100 == 1)
    		{
    			stop_it(my_interval2);
    		}
    }
    
    setInterval('go_fade()', 5000 );
    </script>
    
    
    <div id="sub1" style="display:block;opacity:1;filter:alpha(opacity=100);">content1</div>
    <div id="sub2" style="display:none;opacity:1;filter:alpha(opacity=100);">content2</div>
    <div id="sub3" style="display:none;opacity:1;filter:alpha(opacity=100);">content3</div>
    <div id="sub4" style="display:none;opacity:1;filter:alpha(opacity=100);">content4</div>
    <div id="sub5" style="display:none;opacity:1;filter:alpha(opacity=100);">content5</div>

  2. #2
    Join Date
    Jun 2008
    Posts
    136
    *BUMP*

    Anyway to make it better?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles