第五章初识jQuery课后作业

1.使用css()方法添加图片边框,单击图片显示图片bian边框

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <img src="imgs/pic.gif" class="tup"/>
    <script src="js/jquery-3.3.1.js"></script>
    <script>
        $(function () {
           $(".tup").click(function () {
               $(".tup").css("border","1px solid");
           });
        });
    </script>

</body>
</html>

2.制作林微因简介页面,单击林微因简介链接显示简介内容,单击主要作品链接显示对应的作品

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>林微因简介</title>
    <style>
        h1{
            color: white;
            background: orangered;
        }
    </style>
</head>
<body>
    <h1 class="yi">林徽因简介</h1>
    <div class="jian">
        <p>林徽因,女,汉族,原名林徽音,出生于浙江杭州,祖籍福建福州。中国著名建筑家、诗人、作家。人民英雄纪念碑和中华人民共和国国徽深化方案的设计者</p>
        <p>林徽因是建筑师梁思成的第一任妻子。三十年代初,与夫婿梁思成用现代科学方法研究方法研究中国古代建筑,成为这个学术领域的开拓者。</p>
    </div>
    <h1 class="er">主要作品</h1>
    <div class="zuo">
        <p>《你是人间四月天》</p>
        <p>《宝莲灯》</p>
        <p>《九十九度中》</p>
    </div>
    <script src="js/jquery-3.3.1.js"></script>
    <script>
        $(function () {
           $(".jian") .hide();
           $(".zuo").hide();
           $(".yi").click(function () {
              $(".jian").show();
           });
           $(".er").click(function () {
              $(".zuo").show();
           });
        });
    </script>
</body>
</html>

 

展开阅读全文

没有更多推荐了,返回首页