SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Thread: News Rotator

  1. #1
    SitePoint Enthusiast
    Join Date
    May 2006
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    News Rotator

    Hello,
    I have a little div switcher:
    http://www.xhtmlthis.com/clients/js_divswitcher/

    And im stuck on how to make it pause and play with it still bieng in the 123 order.

    And just to even get it to stop im having trouble.

    Please help.

  2. #2
    Non-Member deathshadow's Avatar
    Join Date
    Jul 2006
    Location
    Dublin, NH
    Posts
    901
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try this on for size:

    Code:
    <html><head>
    <script type="text/javascript">
    var content=new Array('11111111','22222222','33333333');
    var direction=1;
    var current=content.length; 
    
    function update() {
    	document.getElementById('divHTML').innerHTML=content[current];
    }
    
    function loop_em() {
    	if (direction!==0) {
    		current=(current+direction)%content.length;
    		while (current<0) { current+=content.length; }
    	}
    	update();
    	loop_timer=setTimeout("loop_em();",1000);
    }
    
    function start() {
    	direction=1;
    	document.getElementById('startstop').innerHTML='<a href="#" onclick="stop();">Stop</a>';
    	loop_em();
    	return true;
    }
    
    function reverse() {
    	direction=-1;
    	document.getElementById('startstop').innerHTML='<a href="#" onclick="stop();">Stop</a>';
    	loop_em();
    	return true;
    }
    
    function stop() {
    	direction=0;
    	document.getElementById('startstop').innerHTML='<a href="#" onclick="start();">Start</a>';
    	clearTimeout(loop_timer);
    	return true;
    }
    
    function previous() {
    	stop();
    	current--;
    	while (current<0) { current+=content.length; }
    	update();
    	return true;
    }
    
    function next() {
    	stop();
    	current=(current+1)%content.length;
    	update();
    	return true;
    }
    
    window.onload=loop_em;
    </script>
    
    </head><body>
    	<div id="divHTML"></div>
    	<div id="divSettings">
    		<span id="previous"><a href="#" onclick="previous();">&lt; Previous</a></span> |
    		<span id="startstop"><a href="#" onclick="stop();">Stop</a></span> |
    		<span id="next"><a href="#" onclick="next();">Next &gt;</a></span>
    	</div>
    
    </body></html>
    A bit rough around the edges, but methinks that does what you are asking for. You'll notice I tossed in 'reverse' functionality as well, though it's not implemented in the html part. Just call that as you would start.

    Putting your 'values' in an array also means you don't have to write a new function as you add/remove entries. I'm assuming this is for a news switcher or image swap of some sort - being able to have as many or as few as you like by simply changing the array is more desirable, ja?

  3. #3
    SitePoint Enthusiast
    Join Date
    May 2006
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks! Ill try it out and see if it works and reply here.

  4. #4
    SitePoint Enthusiast
    Join Date
    May 2006
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks alot! It works!

  5. #5
    SitePoint Enthusiast
    Join Date
    May 2006
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    By any chance is it possible for me to click a tab and it will load a slide? and it will stop and put a play button like say if I was to click next?


Bookmarks

Posting Permissions

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