A little html help

Soldato
Joined
20 Aug 2004
Posts
3,115
Location
Bournemouth
Ok my skill level is around stupid to medium but I cant find what I am after on google. I have my website frontpage in a way I like atm cept for one think.

http://www.oxygene13.co.uk

Thats how it is now. Its a series of images held in a table and certain letters are rollover pics and links. More links can be added ot other letters when I need. Its fine, its simple, but its missing soemthing.
Basically I use firefox so theres no alt text popup to know where the link is taking you. The think I decided would look best is to instead have text appear under the pictures that says what the link is.
IS this doable in my skill lvl, and how so?
 
Stick another row in the table.
in each cell put an invisible span with the text you want to display.
Code:
<tr><td><span id="g" style="visibility:hidden;">g</span></td><td>.....</tr>

On the onmouseover event:
onmouseover="MM_swapImage('Gallery','','letters/grollover.jpg',1);showletter('g')"
on the mouse out event:
onmouseout="MM_swapImgRestore();hideletter('g')"

Code:
function showletter(whichletter){
document.getElementById(whichletter).style.visibility = visible;
}
function hideletter(whichletter){
document.getElementById(whichletter).style.visibility = hidden;
}

something like that!
Oh and move your image and area map back inside the final </body></html> tag.
 
ooops yeah forgot I left those in there lol. not using those area maps any more and had em there cause I didnt have another notepad in.

Btw is there any way you could stick up a working model? I find it so much easier reverse engineering something else.
 
Last edited:
oxygene said:
Basically I use firefox so theres no alt text popup to know where the link is taking you.
Actually, the title attribute is used by FF like the alt tag is in IE.

Code:
<a href="gallery.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Gallery','','letters/grollover.jpg',1)"><img src="letters/grollunder.jpg" alt="Gallery" title="Gallery" width="44" height="146" border="0" id="Gallery" /></a>

Also, the images on that page really need to be 16 colour gifs, as they are flat colour and there are a lot of artifacts on them.
 
Back
Top Bottom