why does this work by element?
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
If you click on each one, it disappears.
But if I code it with a hover..
<script>
$(document).ready(function(){
$("p").hover(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
<p>Click me away!</p>
<p>Click me too!</p>
They all disappear together. What's the difference?
This is because when you are hovering above the first <p>
element, it disappears, and therefore the second <p>
element moves up to take its place - this process repeats until all the <p>
elements are hidden away because your mouse will always be hovering above them.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With