News ticker play/pause button issue with jquery

[deepM]

Hello,

I am working on news Ticker with Jquery. Its working fine. I want to show latest tweets on this ticker.The problem arises when i clicks on the pause button for a while and then clicks on play button again, for first time it shows me tweets very rapidly and then it again works fine.

Can anyone please check my pause button method and tell me what is wrong there?

Here is my code-

<script>
	$(function() {
	  $("#refresh").click(function() {
	     $("#mydiv").load("tweet-1.php")
	  })
	})
</script>
<script>
	$(document).ready(function() {

		//Speed of the slideshow
		var speed = 5000;

		//You have to specify width and height in #slider CSS properties
		//After that, the following script will set the width and height accordingly
		$('#feed-ticker, .tweet_list li').width($('#slider').width()+770);
		$('.tweet_list').width($('#slider').width()+200 * $('.tweet_list li').length);
		$('#feed-ticker, .tweet_list li, #mask-excerpt, #excerpt li').height($('#slider').height());

		//Assign a timer, so it will run periodically
		var run = setInterval('newsscoller(0)', speed);

		$('.tweet_list li:first, #excerpt li:first').addClass('selected');

		//Pause the slidershow with clearInterval
		$('#btn-pause').click(function () {
			clearInterval(run);
			return false;
		});

		//Continue the slideshow with setInterval
		$('#btn-play').click(function () {
			run = setInterval('newsscoller(0)', speed);
			return false;
		});

		//Next Slide by calling the function
		$('#btn-next').click(function () {
			newsscoller(0);
			return false;
		});

		//Previous slide by passing prev=1
		$('#btn-prev').click(function () {
			newsscoller(1);
			return false;
		});

		//Mouse over, pause it, on mouse out, resume the slider show
		$('#slider').hover(

			function() {
				clearInterval(run);
			},
			function() {
				run = setInterval('newsscoller(0)', speed);
			}
		);

	});
	function newsscoller(prev) {

		//Get the current selected item (with selected class), if none was found, get the first item
		var current_image = $('.tweet_list li.selected').length ? $('.tweet_list li.selected') : $('.tweet_list li:first');
		var current_excerpt = $('#excerpt li.selected').length ? $('#excerpt li.selected') : $('#excerpt li:first');

		//if prev is set to 1 (previous item)
		if (prev) {

			//Get previous sibling
			var next_image = (current_image.prev().length) ? current_image.prev() : $('.tweet_list li:last');
			var next_excerpt = (current_excerpt.prev().length) ? current_excerpt.prev() : $('#excerpt li:last');

		//if prev is set to 0 (next item)
		} else {

			//Get next sibling
			var next_image = (current_image.next().length) ? current_image.next() : $('.tweet_list li:first');
			var next_excerpt = (current_excerpt.next().length) ? current_excerpt.next() : $('#excerpt li:first');
		}

		//clear the selected class
		$('#excerpt li, .tweet_list li').removeClass('selected');

		//reassign the selected class to current items
		next_image.addClass('selected');
		next_excerpt.addClass('selected');

		//Scroll the items
		$('#feed-ticker').scrollTo(next_image, 800);
		$('#mask-excerpt').scrollTo(next_excerpt, 800);

	}
</script>

<div id="debug"></div>
	<div id="slider">
		<div id="feed-ticker" class="query">
		</div>
	</div>
<div id="buttons">
	<a href="test.php"id="refresh" target="_self"><img src="../images/control_refresh.png" alt="Refresh" border="0" /></a>
	<a href="#" id="btn-pause" target="_self"><img src="../images/control_pause.png" alt="Pause" border="0" /></a>
	<a href="#" id="btn-play" target="_self"><img src="../images/control_play.png" alt="Play" border="0" /></a>
</div>

Thanks in advance.