javascript - jQuery hover function not working and don't know why -
i have following code supposed show content of paragraph doesn't work:
jquery
<script> $(document).ready(function () { $('.portfolio-excerpt').hover(function () { $('.portfolio-text').addclass('portfolio-hover') }, function () { $('.portfolio-text').removeclass('portfolio-hover') }) }) </script>
html
<div class="portfolio-img"> <a href="images/portfolio-big.jpg"><img src="images/thumbnail.jpg"/></a> <p class="portfolio-excerpt">they thing better.</p> <p class="portfolio-text">lorem ipsum</p> </div>
css
.portfolio-hover { display:block; } p.portfolio-excerpt { display:block; height:30px; width:auto; } p.portfolio-text { display:none; }
which not working , don't know why. can help?
all need changing css declaration.
p.portfolio-text{ display:none; } p.portfolio-excerpt{ display:block; height:30px; width:auto; } p.portfolio-hover{ display:block; }
here working page --> jsfiddle
you forgot adding p
before .portfolio-hover
, put on end of styles. thats all.
Comments
Post a Comment