码迷,mamicode.com
首页 > Web开发 > 详细

css滚动条

时间:2017-09-20 00:59:19      阅读:257      评论:0      收藏:0      [点我收藏+]

标签:index   dex   mat   class   css   round   script   animate   load   

1、顶部滚动条

<img src="1.jpg">

<script>
$(".loading .pic").animate({width:10%},100);
</script>

<img src="2.jpg">

<script>
$(".loading .pic").animate({width:50%},100);
</script>

<img src="3.jpg">

<script>
$(".loading .pic").animate({width:100%},100,function(){
        $(".loading").fadeOut();   
});
</script>


<style>
.loading{width:100%;height:100%;position:fixed;top:0;left:0;z-index:100;background:#fff;}
.loading .pic{width:100%;height:10px;position:absolute;top:0;left:0;
background:#f33}
</style>


<div class="loading">
    <div class="pic"></div>
<div>

  

css滚动条

标签:index   dex   mat   class   css   round   script   animate   load   

原文地址:http://www.cnblogs.com/chenweichu/p/7554728.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!