Is there anyway to give image MouseOver...

[Short Tech]

...with HTML, DHTML, or CSS? I've looked all over Google and Ask and I can't seem to find a MouseOver that uses JUST HTML, DHTML, or CSS AND works. If you know this off the top of your head, or know where to find it or a generator, please and thank you.

[BigJohnny]

yes, it's kind of a hack, but it uses a CSS class called hover.see here:http://www.tutorio.com/tutorial/pure.../picpopup.html

[circusmort]

Funny enough I've been writing a tutorial on that very subject - here's how I do things like that - works real sweetHere's the HTML for a navigation area:<a href="websites.asp" accesskey="1" title = "Website's I've designed and built">Websites</a><a href="graphic-design-scotland.asp" accesskey = "2" title = "Graphic Design projects">Print</a><a href="multimedia.asp" accesskey = "3" title = "Multimedia projects for CD ROM, DVD and Online">Multimedia</a><a href="directype.asp" accesskey = "4" title = "Learn about Directype custom image creation">Directype</a>and the various CSS you need to make it display correctly - which you can of course play around with.div#navigation{float:left;width:170px;margin: 0px;padding: 0px; }#navigation ul span{ display: none}#navigation ul {width: 170px;margin: 0px;text-align: left;padding-left: 20px;padding-top: 80px;float: left;}#navigation li {list-style-type: none;margin: 0px;padding: 0px;width: 170px;} #navigation li a { margin-top: 10px;_margin-top: 5px;margin-bottom: 5px; display: block;width: 170px;height: 30px;color: #000;text-decoration: none;font-size: 2.2em; border-bottom-width: 2px;border-bottom-style: dotted;border-bottom-color: #004B4B;border-top-style: none;border-top-width: 0px;border-right-width: 0px;border-left-width: 0px;border-right-style: none;border-left-style: none;}/* test \ test */#navigation li a {padding: 0px;}#navigation li a:hover {border-bottom-color: #fff;}#multimediabutton a{background-image: url(images/nav/multimedia.gif);background-repeat: no-repeat;background-position: left top;}#multimediabutton a:hover{background-image: url(images/nav/multimedia-b.gif);background-repeat: no-repeat;background-position: left top;}#websitebutton a{background-image: url(images/nav/websites.gif);background-repeat: no-repeat;background-position: left top;}#websitebutton a:hover{background-image: url(images/nav/websites-b.gif);background-repeat: no-repeat;background-position: left top;}#printbutton a{background-image: url(images/nav/print.gif);background-repeat: no-repeat;background-position: left top;}#printbutton a:hover{background-image: url(images/nav/print-b.gif);background-repeat: no-repeat;background-position: left top;}#directypebutton a{background-image: url(images/nav/directype.gif);background-repeat: no-repeat;background-position: left top;}#directypebutton a:hover{background-image: url(images/nav/directype-b.gif);background-repeat: no-repeat;background-position: left top;}Hopefully the way it's all laid out will make sense in dreaweaver - or whatever editor you're using - the names should all clearly tie in with each other and you'll easily be able to adjust the names and CSS properties to suit your own needs