Javascript Scoller with Mouseover - Computer Programmers, Programming Forum

cancer10 · #1 09-26-2008

Hey

Attached is a javascript Scrolling demo which I got from dynamicdrive.com (http://www.dynamicdrive.com/dynamici...rightslide.htm)

Its working fine.

However, I was not able to add a mouseover effect on the scrolling images.

For example.
If I mouseover on tn_scroller_bw_01.jpg image, then that image should be replaced by tn_scroller_01.jpg and once the mouseout event occurs, the old image tn_scroller_bw_01.jpg should be loaded back.

Plz guide.

Thanx

bfsog · #2 09-27-2008

As far as I can see you have not attempted to try this yourself, am I right?

What you have to do is edit these lines (I assume you want the mouseover/mouse out for both images).

Code:

leftrightslide[0]='<img src="images/tn_scroller_bw_00.jpg" border=0>'
leftrightslide[1]='<img src="images/tn_scroller_bw_01.jpg" border=0>'

You will want to add the onmouseout and onmouseover hooks to both of them. Either call a function or do it right there.

cancer10 · #3 09-27-2008

The attached code is what I have tried from my end.

The following two lines are being added.

But no luck

Code:

onmouseover="this.src=\'images/tn_scroller_00.jpg\'" onmouseout="this.src=\'images/tn_scroller_bw_00.jpg\'"

bfsog · #4 09-27-2008

Code:

leftrightslide[0]="<img src=\"images/tn_scroller_bw_00.jpg\" border=\"0\" onmouseover=\"this.src='images/tn_scroller_00.jpg'\" onmouseout=\"this.src='images/tn_scroller_bw_00.jpg'\" />";

cancer10 · #5 09-27-2008

Now this is strange.

If I directly open the HTML file with my browser it works like a charm.

But when I access it thru localhost then I get a dancing and shaking image.

What can be the reason for this?