关于DIV css样式宽度设成百分比怎么在浏览器中获得它的像素

来源:互联网 发布:网络教学人物素描视频 编辑:程序博客网 时间:2024/04/27 01:11

html

<div class="btnNone">    none情况下获取Container宽度</div><div class="btnBlock">    block情况下获取Container宽度</div><div class="container none">    <div class="item">    </div></div>

css

    .container{        width: 100%;        height: 100%;        background: #FFFF80;    }    .block{        display: block;    }    .none{        display: none;    }    .item{        height: 50%;        width: 50%;        background: #80FF80;    }    .btnNone,.btnBlock{        width: 250px;        height: 40px;        font-size: 16px;        background: #FF8080;        color: #ffffff;        font-weight: bolder;        text-align: center;        line-height: 40px;        margin: 20px;        position: fixed;        z-index: 99;    }    .btnBlock{        top: 100px;    }    .btnNone{        top:200px;    }

js

(function ($) {        $('.btnBlock').click(function(){            $('.container').removeClass('block').removeClass('none').addClass('block');            alert($('.item').css('height'));        })        $('.btnNone').click(function(){            $('.container').removeClass('none').removeClass('block').addClass('none');            alert($('.item').css('height'));        })    })(jQuery)

初始状态
这里写图片描述
none情况下获取Container宽度
这里写图片描述
block情况下获取Container宽度
这里写图片描述

0 0
原创粉丝点击