imagebar that slides on mouse follow

[pieterbeulens]

Hi there,

I would like to make an imagebar consisting of two layers, so that the innerlayer slides through the outer layer. I have already managed to do this (see http://www.emmahuis.nl/suus ), but I would like to have the imagebar move on mouse follow, just as it would in Flash (see http://www.symor.com, click on Collection and then bodyfashion. Is this possible in Javascript and if so, can anyone tell me how to do this?

Thanks in advance!

[RoyW]

Put this extra code in with your other javascripts

/** EXTRA ***/
function overScroll(e)
{
	var x = event.x;

	if(x < 150)
		P7_HScroller('view','Right',0,350,'Fast');
	else if (x < 200)
		P7_HScroller('view','Right',0,350,'Medium');
	else if (x < 250)
		P7_HScroller('view','Right',0,350,'Slow');
	else if (x < 350)
		P7_HScroller('view','Left',0,350,'Slow');
	else if (x < 450)
		P7_HScroller('view','Left',0,350,'Medium');
	else if (x < 550)
		P7_HScroller('view','Left',0,350,'Fast');
}
function outScroll(e)
{
	P7_HScroller('view','Stop',0,0,'Fast')
}
/** EXTRA ***/

Change your div to

<DIV class="layerstyle" id="viewport" [color=red]onmousemove="overScroll()" onmouseout="outScroll()"[/color]
style="Z-INDEX: 2; LEFT: 110px; OVERFLOW: hidden; WIDTH: 350px; CLIP: rect(0px 350px 157px 0px); POSITION: absolute; TOP: 250px; HEIGHT: 157px">

This works in IE only. I don't have any other browsers re-installed yet to test with.

[pieterbeulens]

Wow! You're the best! Thanks, it works perfectly!