JS滚动bxslider的使用

模板网 2014-10-24

1. 详细Demo:http://www.bxslider.com/examples

2、如何使用

在实际中如下引用:

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/jquery.bxslider.js"></script>

bxslider无缝滚动

<script type="text/javascript">

  $(function(){

    $('#marquee').bxSlider({

     mode:'vertical', //默认的是水平

     ticker: true,//自动滚动

     tickerSpeed:1000//tickerSpeed有逆影响速度。 因此,一个价值5000的滚动很慢,而价值50将滚动得很快。

    });

    }); 

</script>

bxslider滚动li

<script type=text/javascript>

$(function(){

  $('#marquee').bxSlider({

        mode:'vertical', //默认的是水平

        displaySlideQty:1,//显示li的个数

        moveSlideQty: 1,//移动li的个数  

        captions: true,//自动控制

        auto: true,

        controls: false//隐藏左右按钮

  });

}); 

</script>-->

3、关于bxSlideer的html结构

<div style="width:450px; height:296px; float:left; overflow:hidden; margin-left:200px;">

  <ul id="marquee">

            <li><img src="img/1.jpg" alt="banner_腋臭" style="width:450px; height:296px;"></li>

            <li><img src="img/2.jpg" alt="banner_腋臭" style="width:450px; height:296px;"></li>

     </ul>

</div>

4、关于bxSlideer的左右按钮的css样式

.bx-prev{ width:12px; height:26px; background:#f00;text-indent: -999999px;z-index: 999;  position: absolute; float:left; left:455px; top:110px;}

.bx-next{ width:12px; height:26px;  background:#f00; text-indent: -999999px;z-index: 999;  position: absolute; top:110px;left:-15px;}

相关文章

  1. Zepto.js手机页面上替代jQuery的最佳Javascript库

    Zepto.js手机页面上替代jQuery的最佳Javascript库,Zepto是现代的浏览器最大程度上与jQuery兼容的API,简约的JavaScript库 ,如果你使用jQuery,你已经知道如何使用的Zepto。 虽然100%的jQuery覆盖率不是一个设计目标, 提供的API相匹配的jQuery的同行 。

  2. 隐藏统计代码的LOGO文字

    网站上添加网站统计代码后,一些情况下会影响网站整体的美观性,我们可以通过以下代码来隐藏统计代码的LOGO或文字。 将各种统计代码放到以下div中即可: 复制代码 代码如下: !--统计代码开始-- div style=display:none; !--百度统计-- script type=text/java

  3. html input输入时默认启动数字输入法

    当文本框只能输入数字是一个很常见的需求,比如电话号码,身份证号,卡号, 数量....等等只允许数字输入,为了更好的用户体验性,直接写出 启动数字键盘的需求,我和大多数人一样用this.style.imeMode=disabled; imeMode有四种形式,分别是: active 代表输

  4. 几种常用的医院地图API接口地址—百度地图

    几种常用的医院地图API接口地址,医疗网站上经常使用的来院路线地图,调用第三方平台提供的地图接口,下面是医疗模板库为大家收集整理的几种常用的地图API接口。 1、百度地图: 网址: http://api.map.baidu.com/lbsapi/creatmap/index.html 2、搜狗地图:

  5. 让position:fixed在IE6下可用!

    /*让position:fixed在IE6下可用!*/ .fixed-top/*头部固定*/{position:fixed;bottom:auto;top:0px;} .fixed-bottom/*底部固定*/{position:fixed;bottom:0px;top:auto;} .fixed-left/*左侧固定*/{position:fixed;right:auto;left:0px;} .fixed-right/*右侧固定

随机推荐

  1. Zepto.js手机页面上替代jQuery的最佳Javascript库

    Zepto.js手机页面上替代jQuery的最佳Javascript库,Zepto是现代的浏览器最大程度上与jQuery兼容的API,简约的JavaScript库 ,如果你使用jQuery,你已经知道如何使用的Zepto。 虽然100%的jQuery覆盖率不是一个设计目标, 提供的API相匹配的jQuery的同行 。

  2. 隐藏统计代码的LOGO文字

    网站上添加网站统计代码后,一些情况下会影响网站整体的美观性,我们可以通过以下代码来隐藏统计代码的LOGO或文字。 将各种统计代码放到以下div中即可: 复制代码 代码如下: !--统计代码开始-- div style=display:none; !--百度统计-- script type=text/java

  3. html input输入时默认启动数字输入法

    当文本框只能输入数字是一个很常见的需求,比如电话号码,身份证号,卡号, 数量....等等只允许数字输入,为了更好的用户体验性,直接写出 启动数字键盘的需求,我和大多数人一样用this.style.imeMode=disabled; imeMode有四种形式,分别是: active 代表输

  4. 几种常用的医院地图API接口地址—百度地图

    几种常用的医院地图API接口地址,医疗网站上经常使用的来院路线地图,调用第三方平台提供的地图接口,下面是医疗模板库为大家收集整理的几种常用的地图API接口。 1、百度地图: 网址: http://api.map.baidu.com/lbsapi/creatmap/index.html 2、搜狗地图:

  5. 让position:fixed在IE6下可用!

    /*让position:fixed在IE6下可用!*/ .fixed-top/*头部固定*/{position:fixed;bottom:auto;top:0px;} .fixed-bottom/*底部固定*/{position:fixed;bottom:0px;top:auto;} .fixed-left/*左侧固定*/{position:fixed;right:auto;left:0px;} .fixed-right/*右侧固定