jQuery第五章課後作業
阿新 • • 發佈:2019-01-21
4.使用css()方法新增圖片邊框,,單擊圖片顯示圖片邊框。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>使用css()方法新增圖片邊框</title> <style> body{text-align: center;} </style> </head> <body> <img src="images/pic.gif"> </body> <script src="js/jquery-1.12.4.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("img").click(function () { $("img").css("border","1px solid orange") }) }) </script> </html>
5.製作林徽因簡介頁面,點選“林徽因簡介”連結顯示簡介內容,單擊“主要作品”連結顯示對應的作品。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>林薇因簡介</title> <style> #h1,#h2{ background: gray; color: white; text-align: center; height: 80px; line-height: 80px; font-size: 30px; } #div p{ text-indent: 2em; line-height: 30px; } #div{display: none} #h2{ font-size: 20px; height: 60px; line-height: 60px; } #p2{display: none} </style> </head> <body> <h1 id="h1">林徽因簡介</h1> <div id="div"> <p>林徽因,女,漢族,原名林徽音,出生於浙江杭州,祖籍福建福州。中國著名建築家、詩人、作家。人民英雄紀念碑和中華人民共和國國徽深化方案的設計者</p> <p>林徽因是建築師樑思成的第一任妻子。三十年代初,與夫婿樑思成用現代科學方法研究方法研究中國古代建築,成為這個學術領域的開拓者。</p> </div> <h2 id="h2">主要作品</h2> <p id="p2"> 《你是人間四月天》<br> 《寶蓮燈》<br> 《九十九度中》 </p> <script src="js/jquery-1.12.4.js"></script> <script> $(function () { $("#h1").click(function () { //單擊簡介時 $("div").show(); }) $("#h2").click(function () { //單擊主要作品時 $("#p2").show(); }) }) </script> </body> </html>