• jQuery之字体大小的设置


    先获取字体大小,进行处理。

    再将修改的值保存。

    slice() 方法可从已有的数组中返回选定的元素。
    arrayObject.slice(start,end)。
    start     必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
    end     可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
    jQuery代码如下:

    <script type="text/javascript">
        $(function(){
            $("span").click(function(){
                //获取para的字体大小
                var thisEle = $("#para").css("font-size"); 
                //parseFloat的第二个参数表示转化的进制,10就表示转为10进制
                var textFontSize = parseFloat(thisEle , 10);
                //javascript自带方法
                var unit = thisEle.slice(-2); //获取单位
                var cName = $(this).attr("class");
                if(cName == "bigger"){
                        textFontSize += 2;
                }else if(cName == "smaller"){
                        textFontSize -= 2;
                }
                //设置para的字体大小
                $("#para").css("font-size",  textFontSize + unit );
            });
        });
      </script>

    html代码如下:

    <body>
    
    <div class="msg">
        <div class="msg_caption">
            <span class="bigger" >放大</span>
            <span class="smaller" >缩小</span>
        </div>
        <div>
            <p id="para" >
            This is some text. This is some text. This is some text. This is some text. This
            is some text. This is some text. This is some text. This is some text. This is some
            text. This is some text. This is some text. This is some text. This is some text.
            This is some text. This is some text. This is some text. This is some text. This
            is some text. This is some text.
            </p>
        </div>
    </div>
    
    </body>
  • 相关阅读:
    Python中循环引用(import)失败的解决方法
    junit中线程需要注意的问题
    python动态绑定属性和方法
    python输出缓冲区的问题
    使用RateLimiter完成简单的大流量限流,抢购秒杀限流
    guava的限流工具RateLimiter使用
    高性能分布式锁-redisson的使用
    正则表达式
    input 标签鼠标放入输入框补全提示
    Google guava工具类的介绍和使用
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/2695771.html
Copyright © 2020-2023  润新知