改变文字大小

来源：互联网发布：java认证考试一年几次编辑：程序博客网时间：2024/05/21 19:25
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script type="text/javascript" src="jquery-1.10.1.min.js"></script>
    <script> 
        //js方法
        // window.onload = function(){
        //     var btn1 = document.getElementById("btn1");
        //     var btn2 = document.getElementById("btn2");
        //     var p1 = document.getElementById("p1");

        //     var num = 15;
        //     btn1.onclick=function(){
        //         num --;
        //         p1.style.fontSize = num + "px";
        //     };
        //     btn2.onclick=function(){
        //         num ++;
        //         p1.style.fontSize = num + "px";
        //     };
        // };


        //jquery方法
        $(function(){   
            var num = 15;     
            $("#btn1").click(function(){
                if(num>12){
                    num --;
                    $("#p1").css("font-size",num+"px");
                }
            })

            $("#btn2").click(function(){
                if(num<22){
                    num ++;
                    $("#p1").css("font-size",num+"px");
                }
            })
        });
    </script>
</head>
<body>
<input type="button" id="btn1" value="-">
<input type="button" id="btn2" value="+">
<p id="p1" style="font-size:15px">360导航首页。地址栏旁边提示“此页面需要在极速模式下显示不可切换”这个只能用极速模式不能切换到兼容模式的功能怎么实现?</p>

</body>
</html>
阅读全文
0 0