PDA

View Full Version : Rollover script - Changes text.



wentwooddownhill
12-08-2007, 04:24 PM
HI,
I need some help in making a menu which you can rollover and it produces content next to it. Well its not really a menu as such it will be used for news headlines with a short description on the side and after it has been rolled over the full story appears on the side. I have linked to a video below which will hopefully demonstrate what i mean. Any help as how to code this will be appreciated.

http://s121.photobucket.com/albums/o204/southwalesdownhill/?action=view&current=SANY0023.flv

Jas
12-09-2007, 12:32 AM
That looks like a nice script on the video. And it should be very easy to do, if I understand what you want.

What you need is some <div id="1a" onmouseover="showstory(this)"> tags for the "link" (if you want to call them that) and some <div id="1ab" style="display:none"> tags for the stories. Then you create a function in JS called showstory() that take in the value of this (the id of the div) and changes the display to block.

e.g.:


function showstory(id){
document.getElementById(id+"b").style.display = "block";
}


And you'll need a function to do the opposite. display = "none" onmouseout

JohnRostron
12-10-2007, 11:17 AM
Tou could try modifying the floating tooltip technique described here (http://fijiwebdesign.com/content/view/82/77/).

You would need to have the <span> to always position itself in the same place.

Re the video. To show a run of a series of screenshots, Wink (http://www.softpedia.com/get/Internet/WEB-Design/Flash/Wink.shtml) is an excellent capture program that creates a swf file.

John Rostron

wentwooddownhill
12-17-2007, 05:11 PM
Hi,
Could you give an example of how the above code would work in full?
Cheers