手机jquery,手机搜狐网

手机端触屏事件怎么写jquery

最近做移动端的项目，涉及触摸事件很频繁；我接下来介绍下三个基本的触摸事件：

touchstart：触摸开始的时候触发

touchmove：手指在屏幕上滑动的时候触发

touchend：触摸结束的时候触发

下面是我刚写的一个小demo，可以复制体验下，测试的话打开浏览器的开发者工具的手机模式，点击屏幕移动就能体验到了，滚动鼠标是无效的哦~

!DOCTYPE html

html

head

    meta charset="UTF-8"

    titless/title

    style.sb{width: 100%;height: 200px;background-color: red}/style

    script typet="text/javascript" src=""/script

/head

body

div style="height: 3000px"

    div /div

/div

    script

           //touchmove  手指不放发生

        $('body').on('touchmove',function(){

            $('.sb').css({'display':'none'})  //隐藏div

        })

               //touchend   手指放开发生

        $('body').on('touchend',function(){

            $('.sb').css({'display':'initial','position':'fixed'})  //显示，固定div

        })

    /script

/body

/html

相关问答

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

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

$(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

Q2: 手机的jquery oncilck事件怎么失效

jquery里有个一次性的事件处理方法：one(eventType,fn)。

具体可以这样做：

$(function(){

$("#s1").one("click",showDIV(1));

});

jquery还有一个解除事件委派的方法：unbind([eventType])。参数是可选的，如果不选，则表示移除节点所有已绑定事件。

这里你只需要解除click事件，可以用$("#s1").unbind("click")来处理。

Q3: jquery怎么禁止手机页面触屏滑动页面滚动

1、jquery 监听页面滚动使用的方法：.scroll()。

2、新建一个HTML文档，定义body的高度。

3、创建JS脚本，使用.scroll() 方法监听页面滚动。

4、如果页面发生滚动，则执行函数，弹出一个hello。

5、保存文件，查看.scroll()监听页面滚动的效果。

Q4: jquery和jQueryMobile的区别jquerymobile

jquerymobile是以jquery为基础的.

其相关的接口和使用的页面样式都是为了达到让web app更趋向于native app的目的.

可以理解为jquery是为了传统web而生,而jquerymobile相当于jquery的扩展,是为了让传统的web更像现在的手机应用.

Q5: jquery mobile的主要应用场景在哪

jquery mobile主要是应用在移动端网页开发。

jQuery Mobile是jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库，而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。

JQM 的使命是向所有主流移动浏览器提供一种统一体验，使整个 Internet 上的内容更加丰富 — 不管使用哪种查看设备。

JQM 的目标是在一个统一的 UI 中交付超级 JavaScript 功能，跨最流行的智能手机和平板电脑设备工作。与 jQuery 一样，JQM 是一个在 Internet 上直接托管、免费可用的开源代码基础。事实上，当 JQM 致力于统一和优化这个代码基时，jQuery 核心库受到了极大关注。这种关注充分说明，移动浏览器技术在极短的时间内取得了多么大的发展。