JS滚动bxslider的使用
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;}
相关文章
- a标签点击过后出现虚线的解决方法
问题:a标签点击过后出现虚线 解决方法:a{blr:expression(this.onFocus=this.blur());outline: none;}
- 手机站上离线宝被UC浏览器屏蔽解决方案
手机站上离线宝被UC浏览器屏蔽解决方案,在手机站上使用离线宝发现在UC浏览器中被屏蔽了。页面上会有很大一块空白,怎么办? 利用一下代码可以解决离线宝被屏蔽时,去除头部空白。 复制代码 代码如下: document.writeln(script type=\text/javascript\ src=\
- Zepto.js手机页面上替代jQuery的最佳Javascript库
Zepto.js手机页面上替代jQuery的最佳Javascript库,Zepto是现代的浏览器最大程度上与jQuery兼容的API,简约的JavaScript库 ,如果你使用jQuery,你已经知道如何使用的Zepto。 虽然100%的jQuery覆盖率不是一个设计目标, 提供的API相匹配的jQuery的同行 。
- html禁止手机页面放大缩小代码
只需网页头部head标签内添加一下代码即可实现禁止手机页面放大缩
- 4种动态加载JS的方法
要实现动态加载JS脚本有4种方法: 1、直接document.write 复制代码 代码如下: script language=javascript document.write(script src=test.js\/script); /script 2、动态改变已有script的src属性 复制代码 代码如下: script src= id=s1/script script langu
随机推荐
- a标签点击过后出现虚线的解决方法
问题:a标签点击过后出现虚线 解决方法:a{blr:expression(this.onFocus=this.blur());outline: none;}
- 手机站上离线宝被UC浏览器屏蔽解决方案
手机站上离线宝被UC浏览器屏蔽解决方案,在手机站上使用离线宝发现在UC浏览器中被屏蔽了。页面上会有很大一块空白,怎么办? 利用一下代码可以解决离线宝被屏蔽时,去除头部空白。 复制代码 代码如下: document.writeln(script type=\text/javascript\ src=\
- Zepto.js手机页面上替代jQuery的最佳Javascript库
Zepto.js手机页面上替代jQuery的最佳Javascript库,Zepto是现代的浏览器最大程度上与jQuery兼容的API,简约的JavaScript库 ,如果你使用jQuery,你已经知道如何使用的Zepto。 虽然100%的jQuery覆盖率不是一个设计目标, 提供的API相匹配的jQuery的同行 。
- html禁止手机页面放大缩小代码
只需网页头部head标签内添加一下代码即可实现禁止手机页面放大缩
- 4种动态加载JS的方法
要实现动态加载JS脚本有4种方法: 1、直接document.write 复制代码 代码如下: script language=javascript document.write(script src=test.js\/script); /script 2、动态改变已有script的src属性 复制代码 代码如下: script src= id=s1/script script langu