jQuery滑动并响应事件

jQuery滑动并打开指定页面:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
  $(".a").click(function(){
    $(".a").animate({left:‘250px‘},function(){location.href="http://www.baidu.com"});
  });
});
</script>
</head>

<body>
<p>默认情况下,所有 HTML 元素的位置都是静态的,并且无法移动。如需对位置进行操作,记得首先把元

素的 CSS position 属性设置为 relative、fixed 或 absolute。</p>
<h3>点击方块执行</h3>
<div class=‘a‘ style="background:#98bf21;height:100px;width:100px;position:absolute;">
</div>

</body>
</html>

jQuery来回滑动并响应事件:

<!DOCTYPE html>
<html>
<head>
<script src="jquery/jquery.js">
</script>
<script>
$(document).ready(function(){
  $("#box").toggle(function(){
    $("#box").animate({left:‘200px‘},function(){alert(‘Slide to the right‘);}).text(‘ON‘);},
    function(){
    $("#box").animate({left:‘‘},function(){alert(‘Sliding to the left‘);}).text(‘OFF‘);}
  );
});
</script>
</head>

<body>
<p>默认情况下,所有 HTML 元素的位置都是静态的,并且无法移动。如需对位置进行操作,记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute。</p>
<h3>点击方块执行</h3>
<div id=‘box‘ style="background:#98bf21;height:100px;width:100px;position:absolute;">OFF
</div>

</body>
</html>

jQuery下载:http://files.cnblogs.com/liuswi/jquery.js

jQuery滑动并响应事件

时间: 2024-10-12 08:34:14

jQuery滑动并响应事件的相关文章

Unity3D判断鼠标向右或向左滑动,响应不同的事件

private var first = Vector2.zero; private var second = Vector2.zero; function Update () { } function OnGUI () { if(Event.current.type == EventType.MouseDown) { //记录鼠标按下的位置 first = Event.current.mousePosition ; } if(Event.current.type == EventType.Mou

jQuery动态添加html元素后,响应事件的问题记录

var li =     "<li>" +     "<a>" +        // 缩略图 点击部分 index='" + i + "'        "<span class='CameraImg' type='play' index='" + i + "'>" +          "<img src='/HiHomeBabyMS/Public/i

jQuery基础(鼠标事件,表单事件,键盘事件,自定义事件 篇)

1.jQuery鼠标事件之click与dbclick事件 方法一:$ele.click()(不带参数) <div id="test">点击触发<div> $("ele").click(function(){ alert('触发指定事件') }) $("#test").click(function(){ $("ele").click() //手动指定触发事件 });   方法二:$ele.click( h

【jQuery源码】事件存储结构

a. jQuery事件原型——Dean Edwards的跨浏览器AddEvent()设计 源码解读   重新梳理一下数据结构,使用一个例子 <input type="text" id="chua" onClick="f0();"> function f0(){...} function f1(){...} function f2(){...} function f3(){...} var dom = document.getEleme

android通知栏Notification点击,取消,清除响应事件

主要是检测android通知栏的三种状态的响应事件 这次在实现推送需求的时候,要用到android通知栏Notification点击后进入消息页面,因为要实现一个保存推送用户名字的功能,我在点击后处理了这个功能,但是测试发现我点击删除或者滑动清除后这个功能并没有执行,所以才意识到要处理删除和滑动清除的事件: 首先实现一个BroadcastReceiver public class NotificationBroadcastReceiver extends BroadcastReceiver {

移动端touch触屏滑动事件、滑动触屏事件监听!

移动端touch触屏滑动事件.滑动触屏事件监听! 一.触摸事件 ontouchstart.ontouchmove.ontouchend.ontouchcancel 目前移动端浏览器均支持这4个触摸事件,包括IE.由于触屏也支持MouseEvent,因此他们的顺序是需要注意的:touchstart → mouseover → mousemove → mousedown → mouseup → click1 Apple在iOS 2.0中引入了触摸事件API,Android正迎头赶上这一事实标准,缩小

禁止了鼠标或者是手指滑动的默认事件,后期需要恢复,该怎么做呢

做前端开发,需要根据不同时期的需求做针对性的处理,特别是Javascript中的事件处理,如果刚开始禁止了鼠标或者是手指滑动的默认事件,后期需要恢复,该怎么做呢?我今天做了下测试,没什么问题! var mark = true; document.onclick = function(){ if(mark){ mark = false; $("body").bind("touchmove",function(event){ event.preventDefault()

FlexSlider是一个非常出色的jQuery滑动切换插件

FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看! $(window).load(function() { $('.flexslider').flexslider({ animation: "fade", //String: Select your animation type, "fade" or "sl

【jQuery源码】事件委托

jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作 下面主要分析事件的委托设计.事件源我们成为委托节点,委托节点委托他的祖先节点替他执行事件处理,这个祖先节点被成为被委托节点. DOM的原生事件将处理绑定在相应的节点上,相应节点触发事件才能执行处理.将事件处理委托给祖先节点,这个事件处理是附加到祖先节点的.那么需要做到的是,原节点触发了事件,想要执行已经附加到祖先