jquery手机触屏左右滑动切换栏目怎么做

jquery手机触屏左右滑动切换栏目

创新互联公司主营绵阳网站建设的网络公司,主营网站建设方案,成都app软件开发,绵阳h5微信平台小程序开发搭建,绵阳网站营销推广欢迎绵阳等地区企业咨询

$(function(){

TouchSlide({

slideCell:"#slideBox",

titCell:".myhd

ul",

//开启自动分页

autoPage:true

，此时设置

titCell

为导航元素包裹层

mainCell:".bd

ul",

effect:"leftLoop",

autoPage:true,//自动分页

autoPlay:true

//自动播放

});

div

id="slideBox"

class="slideBox"

div

class="bd"

ul

li

a

class="pic"

href="#"img

src="${ctxStatic}/img/mobile/news1.png"

//a

a

class="tit"

href="#"墨西哥教师罢工

与警察激烈冲突/a

/li

li

a

class="pic"

href="#"img

src="${ctxStatic}/img/mobile/news2.jpg"//a

a

class="tit"

href="#"日右翼游行纪念钓岛"国有化"周年/a

/li

li

a

class="pic"

href="#"img

src="${ctxStatic}/img/mobile/news3.jpg"//a

a

class="tit"

href="#"女兵竞选美国小姐鼓励女性自强/a

/li

li

a

class="pic"

href="#"img

src="${ctxStatic}/img/mobile/news4.jpg"//a

a

class="tit"

href="#"济南现“最窄人行道”

仅0.2米宽/a

/li

/ul

/div

div

class="myhd"

ul

style="height:

28px;"/ul

/div

/div

jquery怎么实现左右滑动的问题

script

$(document).ready(function(){

$("#hide").click(function(){

if($("#left").css('width') == '200px'){

$("#left").animate({width:0},"slow");

$("#hide").val('显示');

}else{

$("#left").animate({width:200},"slow");

$("#hide").val('隐藏');

}

});

});

/script

div id="left" style="width:200px; background-color:#009900; float:left;" /div

div id="right" style="width:400px; background-color: #FF0000; float:left;" /div

div style="float:left"

input id="hide" type="button" value="隐藏" /

/div

求教jquery大神，关于手机端的导航手指左右滑动

写代码有些麻烦，给个关键建议。你大概是在拖动页面上遇到麻烦吧！要实现在触控设备上手指拖动元素，不能用mousemove哟，这个是没用的，要用到touchstart(手指接触触摸屏)，touchmove(手指在触摸屏上移动)，touchend(手指离开触摸屏)。touchmove调用的函数里最好填上event.preventDefault() 否则有些浏览器对touchmove也不管用哟！这个还可以开发多点触控，你自己去研究吧！

有关触摸事件参考这里: ;uid=374119f2442b2126e94b23ef1419d180hid=6b989aa1182219e3e0883131a232b00apos=2cid=9pi=di=time=1412014181458from=clickrestype=1pagetype=0000000000000402

新闻名称：jquery左右滑动,jquery左右滑动导航
文章源于：http://ybzwz.com/article/phephi.html