HTML mouseovers? experts and teachers please elaborate?

Question

I'm taking an HTML class at the moment but the teacher isn't to the part where he teaches mouse overs yet and I REALLY wanna learn how to do it, it's one of the few courses I'm actually very excited about learning.

If anyone knows a lot about mouse overs and their different elements and implementations, PLEASE mail me. I'm actually looking for someone who I can talk to in chat to help me with different HTML elements. Thanks!

You can also answer the question here if you don't feel like talking to me, just give an example of a mouser over that would let me understand how it all works.

Answer 1

Sorry, I can't really talk online until I get service at home ;), but this was an easy question to answer, so I thought I'd do you the favor.


BORDER="0" NAME="Menu5"
onmouseover=
"document.Menu5.src=
'images/ex2.jpg'"
onmouseout=
"document.Menu5.src=
'images/ex1.jpg'">

With this code, a link to EX.htm is create with an ex1.jpg as the link. We name the picture menu5 in javascript so we can use onmouseover and onmouseout as attributes. onmouseover is for when you put your mouse on top of the image, and onmouseout is for when you take your mouse off the image. With these 2 elements to search from, I'm sure you'll be able to find a helpful web page where you can see all the implimentations that can be used, and be able to read their code to see how they did it. Hope this helps!

Answer 2

First, the context: Often an easy way to do a mouseover is when you have a link over which the viewer may be moving the mouse. The html would be address and somewhere you'd have a CSS file that'd have a#thislink:hover { background-color: #fff; color: #000; } so that, when the mouse goes over the link the link would turn to white print with a black background.
Or, you could do it in javascript with "onmouseover='status=(\'Herbert\'); return true;'" in which case when the viewer moved the mouse over the link the status line would display the message 'Herbert'.

Mouseover in the second case is an "event" captured by the browser and made available to javascript for processing purposes and the creation of effects on the web page. There are several "events" and standards for their characteristics defined in the Domain Object Model (DOM) which you may find in such books as Javascript The Definitive Reference.

Answer 3

A mouse over is when you run your mouse over an HTML element, like a link. To use it on a link, you need to use styles. I prefer to use stylesheets instead on embedded styles. Here is an example of a link mouseover in a stylesheet.

a:link, a:visited
{color: RGB(0,0,150);
text-decoration: none;
font-family: 'tahoma','serif';
font-weight: bold;}

a:hover
{color: #FFFF00;
text-decoration: underline;
font-family: 'tahoma','serif';}

What this code does is that a regular link and an unvisited link are the same color and when you place the mouse over a link (hover) it changes the color of the link and underlines it.

If you need more help, you can contact me at http://www.yuchniuk.com

I have an HTML tutorial there and am now making a XHTML tutorial and a CSS tutorial.

Answer 4

HTML is open source. If you want to know how to do something you see/like, right click the page where this is happening, select "View Source" and read the HTML that is relevant.