Javascript鼠标悬停，为图像添加边框

Question

I have some circle buttons on my website that I want to get a blue outline when you mouseover .

<img src="/images/example.png" onmouseover="JavascriptHere">

How would I do this? The website I am trying to do this on is http://www.inglesfield.com/ . I already have a mousedown event to prevent image dragging, would it be possible to have both events ( mousedown and mouseover ) independently?

Answer 1

you can add a css hover style on the images

#content:hover { border: 2px solid blue; border-radius: 100px; }

by the way: instead of using ids for the images, use class="content", because ids should be unique on a html page

Answer 2

just use css :hover pseudo class.. you dont need javascript for this

<img class="hover" src="http://www.hollywoodreporter.com/sites/default/files/2012/12/img_logo_blue.jpg"/>
<style> img.hover:hover {border:5px solid #555;} </style>

example: http://jsfiddle.net/orlando/Y3Ux6/