Posted By

Rembrand on 08/11/10


Tagged

links lists


Versions (?)

Clickable list item (or bock or any other element)


 / Published in: jQuery
 

URL: http://www.pseudocoder.com/archives/clickable-box-with-jquery

Originally from http://www.pseudocoder.com Make an li (or div or whatever) clickable without having to wrap it in a link-tag. Like Matt, I like to add a .hover class to it in order to apply hover effects

  1. //http://www.pseudocoder.com/archives/clickable-box-with-jquery
  2.  
  3. $(".item-list li").click(function() {
  4. window.location = $(this).find("a.more").attr("href");
  5. });
  6.  
  7. // add some hover effects
  8. $(".item-list li").hover(
  9. function() {
  10. $(this).addClass("hover");
  11. $(this).append('<div class="learn-more">Learn More</div>');
  12. },
  13. function() {
  14. $(this).removeClass("hover");
  15. $(".learn-more").remove();
  16. }
  17. );
  18.  
  19.  
  20. ---
  21.  
  22. .item-list li {
  23. display: block;
  24. }

Report this snippet  

You need to login to post a comment.