javascript - How do I give a .gif height and width when inserted with onMouseOver -
i have webpage has jpegs switch gifs when hover on them. using code
<img src="images/e911_icon_vi_site_2014_white.jpg" onmouseover="this.src = 'images/e911_icon_vi_site_2014_white.gif'" onmouseout=" this.src = 'images/e911_icon_vi_site_2014_white.jpg'" class="servicesimages">
i gave class of service images can apply style
.servicesimages{ height:300px; width:412px; }
the class worked when normal image. however, rollover image, class doesnt apply , image defaults normal size, both gif , jpeg.
a live example can seen here
how can fix this?
in fact, dont need javascript this. can use pure css.
html
<div class="imgif"></div>
css
.imgif { height: 400px; width: 400px; background-position: center; border-radius:50%; background-image: url("http://placekitten.com/400/400"); } .imgif:hover { background-image: url("http://i.imgur.com/yzgk6hf.jpg"); }
Comments
Post a Comment