<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>制作非緣勿擾頁面特效 </title> <script type="text/javascript" src="./js/jquery-1.8.3.min.js" ></script> <style type="text/css"> .main{ width:500px; } .left{ width:200px; float:left; } .right{ width:300px; float:left; } </style> <script type="text/javascript"> $(document).ready(function(){ $('dt').click(function(){ $('strong').css("color","#FF0099"); }); $(".dy").click(function(){ $('.dy+span').css("font-weight","bold"); }); $('#bq').click(function(){ $("#bq+span>a:even").css("background-color", "#E0F8EA").css("color", "#10A14B").css("padding", "2px"); }); $("img[alt='收藏本片']").click(function(){ alert("您已收藏成功！"); }); }); </script> </head> <body> <div class='main' > <div class='left'> <img src="images/pic.gif" /> <br/><br/><br/><br/> <img src="images/col.gif" alt="收藏本片"/> </div> <div class='right'> <dl> <dt><b>非緣勿擾</b></dt> <dd> <p> <strong>主演：</strong><span>蘇有朋/秦嵐/傅藝偉等</span> </p> <p> <strong class='dy'>導演：</strong><span>賴水清</span> </p> <p> <strong id='bq'>標簽：</strong><span><a>蘇有朋</a> <a> 國產電視劇</a> <a>2013</a> <a>連續劇</a></span> </p> <p> <strong>劇情：</strong><span>當代都市，大年女劉林、楊陽都在尋找自己的如意郎君，劉林偶遇陸氏房地產總裁路西諾，兩人成了歡喜冤家，遭到暗戀西諾的丁娟的嫉恨。。。<a href="#">點擊了解更多 </a></span> </p> </dd> </dl> <img src="images/btn.gif"/> </div> </div> </body> </html>