Help with javascript picture scroller

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
chaser7016
Forum Commoner
Posts: 34
Joined: Sat Nov 04, 2006 3:22 pm

Help with javascript picture scroller

Post by chaser7016 »

feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


Hi Im using the following code at http://www.ryanspahn.net .  Im trying to figure out how to make the picture scroll smoother.  Right now they scroll and towards the end of the scroll the script does not smoothly display the 1st photo again it just blinks and starts the scroll again.  What part of this code needs to b changed? 

[syntax="javascript"]var slideTimeBetweenSteps = 80;	// General speed variable (Lower = slower)
	
	
	var scrollingContainer = false;
	var scrollingContent = false;
	var containerHeight;
	var contentHeight;	
	
	var contentObjects = new Array();
	var originalslideSpeed = false;
	function slideContent(containerId)
	{
		var topPos = contentObjects[containerId]['objRef'].style.left.replace(/[^\-0-9]/g,'');
		topPos = topPos - contentObjects[containerId]['slideSpeed'];
		if(topPos/1 + contentObjects[containerId]['contentHeight']/1<0)topPos = contentObjects[containerId]['containerHeight'];
		contentObjects[containerId]['objRef'].style.left = topPos + 'px';
		setTimeout('slideContent("' + containerId + '")',slideTimeBetweenSteps);
		
	}
	
	function stopSliding()
	{
		var containerId = this.id;
		contentObjects[containerId]['slideSpeed'] = 0;	
	}
	
	function restartSliding()
	{
		var containerId = this.id;
		contentObjects[containerId]['slideSpeed'] = contentObjects[containerId]['originalSpeed'];
		
	}
	function initSlidingContent(containerId,slideSpeed)
	{
		scrollingContainer = document.getElementById(containerId);
		scrollingContent = scrollingContainer.getElementsByTagName('DIV')[0];
		
		scrollingContainer.style.position = 'relative';
		scrollingContainer.style.overflow = 'hidden';
		scrollingContent.style.position = 'relative';
		
		scrollingContainer.onmouseover = stopSliding;
		scrollingContainer.onmouseout = restartSliding;
		
		originalslideSpeed = slideSpeed;
		
		scrollingContent.style.left = '0px';
		
		contentObjects[containerId] = new Array();
		contentObjects[containerId]['objRef'] = scrollingContent;
		contentObjects[containerId]['contentHeight'] = scrollingContent.offsetHeight;
		contentObjects[containerId]['containerHeight'] = scrollingContainer.clientHeight;
		contentObjects[containerId]['slideSpeed'] = slideSpeed;
		contentObjects[containerId]['originalSpeed'] = slideSpeed;
		
		slideContent(containerId);
		
	}
Thanks to any1 who can help!

Cheers, Chaser


feyd | Please use[/syntax]

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Post Reply