When and why to use: hover and onMouserOver and onMouseOut?

Navigation
1

I'm studying about hover , onMouseOver and onMouseOut . Suppose in this situation I want to change the background of an image when I pass the mouse on it.

What is the correct way to program? Is using CSS (: hover ) or through JavaScript (onMouseOver and onMouseOut)? Why? 

<div id="img1">
    <img src="https://vignette.wikia.nocookie.net/unmario/images/a/ad/300px-Nsmb-mushroom-super.jpg/revision/latest?cb=20081217191119"></div><divid="img2">
    <img src="https://vignette.wikia.nocookie.net/unmario/images/a/ad/300px-Nsmb-mushroom-super.jpg/revision/latest?cb=20081217191119">
</div>
    
asked by anonymous 18.10.2017 / 17:46

2 answers

2

This will depend on the effect you want to do, if you just want it to change the image and nothing else, use the hover in the css, so the application will be lighter, if you want a custom hover, more or something, use the css too, it's the same case, the application will be lighter.

But if you're thinking about compatibility with legacy browsers, then use a javascript script.

    
18.10.2017 / 17:51
3

CSS should be used to handle layout and JavaScript to logical part.

Whenever possible choose to use CSS. Make use of JavaScript in cases where CSS features are unable to meet your needs and may need to add functionality ( polyfills ) - you can use Can I use to check the status of features in browsers.

Consider also that there are users who disable JavaScript completely in the browser; some people use extensions that allow JS only on specific pages. Using only CSS is a guarantee that you will have your page displayed in the same way for all users.

    
18.10.2017 / 18:27
onclick event does not work in chrome! What is & quot in Java?