<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>在图片上停留时逐渐增强或减弱的透明效果</title> <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script> <style> img{ width: 200px; height: 200px; } </style> </head> <body> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> <img src="snipaste_20170824_145806.png" alt="" /> </body> <script> $(document).ready(function(){ $("img").fadeTo("slow", 0.6); $("img").hover(function(){ $(this).fadeTo("slow", 1.0); },function(){ $(this).fadeTo("slow", 0.6); }); }); </script> </html>
