Reputation: 1305
I want to hide and show a <p>
tag when mouse over it, but my code only can hide the p
tag and never show it again ,why?
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
$(function(){
$("#mouse").mouseover(function(){
if($(this).is(':hidden')){
$(this).show("normal");
}
else{
$(this).hide("slow");
}
});
});
</script>
</head>
<body bgcolor="white">
<p id="mouse">
test
</p>
</body>
</html>
Upvotes: 0
Views: 147
Reputation: 172
When element is hidden you can't use any event with it. It would be better if you don't hide "p" but hide only element in "p".
Example
<script>
$(document).ready(function() {
$(".hidden").hover(function () {
$(".hidden span").toggle();
});
});
</script>
<p class='hidden'>please hover<span> Hide this text </span></p>
Upvotes: 1