Posted By

bcalloway on 08/28/08


Tagged

javascript jquery rollovers


Versions (?)

Who likes this?

9 people have marked this snippet as a favorite

koncept
xuanyan
blackabee
benrudolph
btully
seanpowell
allproweb
aegony
wirenaught


jQuery rollovers


 / Published in: JavaScript
 

jQuery script for navigation image rollovers

  1. $(document).ready(function() {
  2. // Preload all rollovers
  3. $("#tabs img").each(function() {
  4. // Set the original src
  5. rollsrc = $(this).attr("src");
  6. rollON = rollsrc.replace(/.jpg$/ig,"2.jpg");
  7. $("<img>").attr("src", rollON);
  8. });
  9.  
  10. // Navigation rollovers
  11. $("#tabs a").mouseover(function(){
  12. imgsrc = $(this).children("img").attr("src");
  13. matches = imgsrc.match(/2/);
  14.  
  15. // don't do the rollover if state is already ON
  16. if (!matches) {
  17. imgsrcON = imgsrc.replace(/.jpg$/ig,"2.jpg"); // strip off extension
  18. $(this).children("img").attr("src", imgsrcON);
  19. }
  20.  
  21. });
  22. $("#tabs a").mouseout(function(){
  23. $(this).children("img").attr("src", imgsrc);
  24. });
  25. });

Report this snippet  

You need to login to post a comment.