.attr 与. css

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
        body {
            background: url("img/1.jpg");
        }
        input {
            position: absolute;
            top: 50%;
            left: 50%;
        }
        .btn2 {
            top: 60%;
        }
        div{
            display: none;
            height: 300px;
            width: 300px;
            overflow-y:scroll;
            position: absolute;
            top: 40%;
            left: 40%;
            background-color: white;
            z-index: 1;
        }
    </style>
</head>
<body>
<input   type="button" id="btn1" value="开始游戏" >
<input   type="button" class="btn2" value="详细规则">
<div>
   <p> 游戏说明：</p>
    <p> 1、该游戏为一款好玩的闯关挑战类游戏，可以锻炼玩家的判断力，提高玩家的敏捷思维能力。</p>
    <p> 2、可以选择闯关模式或者挑战模式开始游戏。进入闯关模式后点击上方按钮可选择已解锁的关卡。</p>
    <p> 3、闯关模式总共有十个关卡，每通过一个关卡，游戏难度会逐渐增大。如果玩家玩通关闯关模式，会获得W币奖励。</p>
    <p> 4、挑战模式会计算积分，玩家可以在线存档，也可以提交自己的积分来查看自己的排行。</p>
    <p> 5、本游戏引入了金币机制，即W币，初始金币为3个，玩家可以通过每日签到(+1 W币，连续签到从第二天起+2 W币)和完成每日的挑战任务(随机+7或8或9 W币)或玩通关闯关模式(随机+10或11或12 W币)来获得W币，W币可以用来购买道具。本游戏目前含有四种道具，分别是原地复活道具、水波特效道具、蝴蝶跟随鼠标特效道具和下雪特效道具。原地复活道具只可以在挑战模式使用，其它三种道具均为特效道具，每次购买后有七天使用期限，七天后需再次购买才可继续使用。</p>
    <button id="bt">关闭</button>
</div>
<script src="js/jquery-1.12.4.js"></script>
<script>

    $("#btn1").click(function () {
        location.href="play.html";
    })
    $(".btn2").click(function () {
        $("div").css("display","block")
    })
    $("#bt").click(function () {
        // $("div").css("display","none")


        $("div").attr('style',   $("div").attr('style') + ';display:none;');
    })






</script>
</body>
</html>
   attr('style') 得到的是字符串，而 .css 操作的是对象
猜你喜欢
