jquery.banner.js图片更换

最新推荐文章于 2024-02-09 17:30:00 发布

21989939

最新推荐文章于 2024-02-09 17:30:00 发布

阅读量1.1k

点赞数

分类专栏：【前端】基础

本文链接：https://blog.csdn.net/qq_21989939/article/details/46575781

版权

【前端】基础专栏收录该内容

20 篇文章 0 订阅

订阅专栏

<link href="./resources/css/jqBanner.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="./resources/js/jquery.js"></script>
<script type="text/javascript" src="./resources/js/jquery.banner.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#homeRotatingImage").qp_banner({banner_speed:2000,banner_int:1000,banner_async:false});
    })
</script>
</head>
<body>
     <div id="homeRotatingImage" class="s-skin-container s-isindex-wrap">
            <div class="s-skin-container s-isindex-wrap" style="background-size: cover;background-image: url('./resources/img/background2.jpg');">
            </div>
            <div class="s-skin-container s-isindex-wrap" style="background-size: cover;background-image: url('./resources/img/background1.jpg');">
            </div>
        </div>
</body>

jqBanner.css

.s-skin-container {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -10;
  background-position: center 0;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  zoom: 1;
  background-size: cover;
}