jQuery相簿關燈模式（光線聚焦於滑鼠懸停位置）_程式碼練習
阿新 • • 發佈：2018-11-03
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0px; padding: 0px; } body{ width: 1300px; } table{ margin: 50px auto; } .background{ background: #0D0D0D; /*背景設為黑色*/ } .light-off{ opacity: 0.3;transition: all 1s ease 0s; } </style> </head> <body class="background"> <table> <tr> <td class="light-off"><img src="img/01.jpg"/></td> <td class="light-off"><img src="img/02.jpg"></td> <td class="light-off"><img src="img/03.jpg"></td> </tr> <tr> <td class="light-off"><img src="img/04.jpg" /></td> <td class="light-off"><img src="img/05.jpg" /></td> <td class="light-off"><img src="img/06.jpg"></td> </tr> </table> </body> <script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script> <script> $("td").hover(function(){ $(this).css("opacity","1"); $(this).css("transition","all 1s ease 0s"); },function(){ $(this).css("opacity","0.3"); $(this).css("transition","all 1s ease 0s"); }); </script> </html>