Click to See Complete Forum and Search --> : text bolds on mouse over the link


wildwobby
06-17-2003, 01:54 PM
what is the tag to make a link bold when the mouse is over. or pictures change onn mouse over?

PeOfEo
06-17-2003, 01:57 PM
<style type="text/css">
:link {color:#00ffff;font-weight:;text-decoration:none;}
:active {color:#00ffff;font-weight:;text-decoration:none;}
:visited {color:#00ffff;font-weight:;text-decoration:none;}
:hover {color:#4682b4;font-weight:;text-decoration:bold;}
</style>
place that in your head.

wildwobby
06-17-2003, 02:02 PM
what about pictures?

wildwobby
06-17-2003, 02:10 PM
and that just changes colors

PeOfEo
06-17-2003, 02:14 PM
ok thats a java script more like this.

just edit it I used it a long time ago on another site of mine

<!--

if (document.images) { // Active Images
img1on = new Image();
img1on.src = "http://www.angelfire.com/ego2/bs/images/main_u.gif";
img1off = new Image();
img1off.src = "http://www.angelfire.com./ego2/bs/images/main_o.gif";
img2on = new Image();
img2on.src = "http://www.angelfire.com/ego2/bs/images/games_u.png";
img2off = new Image();
img2off.src = "http://www.angelfire.com./ego2/bs/images/games_o.png";

img3on = new Image();
img3on.src = "http://www.angelfire.com/ego2/bs/images/programs_u.png";
img3off = new Image();
img3off.src = "http://www.angelfire.com./ego2/bs/images/programs_o.png";

img4on = new Image();
img4on.src = "http://www.angelfire.com/ego2/bs/images/apps_u.png";
img4off = new Image();
img4off.src = "http://www.angelfire.com./ego2/bs/images/apps_o.png";
img5on = new Image();
img5on.src = "http://www.angelfire.com/ego2/bs/images/pranks_u.png";
img5off = new Image();
img5off.src = "http://www.angelfire.com./ego2/bs/images/pranks_o.png";
img6on = new Image();
img6on.src = "http://www.angelfire.com/ego2/bs/images/funstuff_u.png";
img6off = new Image();
img6off.src = "http://www.angelfire.com./ego2/bs/images/funstuff_o.png";
img7on = new Image();
img7on.src = "http://www.angelfire.com/ego2/bs/images/support_u.png";
img7off = new Image();
img7off.src
= "http://www.angelfire.com./ego2/bs/images/support_o.png";

img8on = new Image();
img8on.src = "http://www.angelfire.com/ego2/bs/images/screenshots_u.png";
img8off = new Image();
img8off.src = "http://www.angelfire.com./ego2/bs/images/screenshots_o.png";

img9on = new Image();
img9on.src = "http://www.angelfire.com/ego2/bs/images/projects_u.png";
img9off = new Image();
img9off.src = "http://www.angelfire.com./ego2/bs/images/projects_o.png";

img10on = new Image();
img10on.src = "http://www.angelfire.com/ego2/bs/images/peo_u.png";
img10off = new Image();
img10off.src = "http://www.angelfire.com./ego2/bs/images/peo_o.png";

img11on = new Image();
img11on.src = "http://www.angelfire.com/ego2/bs/images/curry_u.png";
img11off = new Image();
img11off.src = "http://www.angelfire.com./ego2/bs/images/curry_o.png";

img12on = new Image();
img12on.src = "http://www.angelfire.com/ego2/bs/images/archives_u.png";
img12off = new Image();
img12off.src = "http://www.angelfire.com./ego2/bs/images/archives_o.png";

}

// Function to show image as mouse moves over the area
function imgOn(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "on.src");
}
}

// Function to show image after mouse moves off the area
function imgOff(imgName) {
if (document.images) {
document[imgName].src = eval(imgName + "off.src");
}
}

// -->

</script> that goes in your head


this is n your body where the link is


<a href onMouseOver="imgOn('img4')" onMouseOut="imgOff('img4')"><img
NAME="img4" SRC="http://www.angelfire.com/ego2/bs/images/apps_o.png" width="119" height="25" ALT="applications"></a> </td>
</tr>

Jona
06-17-2003, 02:15 PM
<!--For links-->
<style type="text/css">
<!--
A {color:blue;}
A:visited {color: purple;}
A:active {color:red;}
A:hover {color:red;}
-->
</style>

<!--For image changes on mouse over-->
<img src="off.gif" onmouseover="this.src='on.gif';" onmouseout="this.src='off.gif';">


Jona

PeOfEo
06-17-2003, 02:17 PM
<style type="text/css">
:link {color:#00ffff;font-weight:;text-decoration:none;}
:active {color:#00ffff;font-weight:;text-decoration:none;}
:visited {color:#00ffff;font-weight:;text-decoration:none;}
:hover {color:#4682b4;font-weight:bold;text-decoration:none;}
</style>
place that in your head. This will make it bold sorry I made a bobo the first time.

wildwobby
06-17-2003, 02:20 PM
still no bold

Jona
06-17-2003, 02:39 PM
Wildwobby, post a link to your page. Apparently you have other CSS code on your document that is overriding what we are giving you.

Jona

PeOfEo
06-20-2003, 01:42 AM
yes my code is tried and tested and will work on any browser too. That code is standard.