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滑动并响应事件的更多相关文章
- jQuery基础(鼠标事件,表单事件,键盘事件,自定义事件 篇)
1.jQuery鼠标事件之click与dbclick事件 方法一:$ele.click()(不带参数) <div id="test">点击触发<div&g ...
- FlexSlider jQuery滑动切换插件 参数
demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...
- android通知栏Notification点击,取消,清除响应事件
主要是检测android通知栏的三种状态的响应事件 这次在实现推送需求的时候,要用到android通知栏Notification点击后进入消息页面,因为要实现一个保存推送用户名字的功能,我在点击后处理 ...
- FlexSlider是一个非常出色的jQuery滑动切换插件
FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看 ...
- 【jquery隐藏、显示事件and提示callback】【淡入淡出fadeToggle】【滑入滑出slideToggle】【动画animate】【停止动画stop】
1.jquery隐藏and显示事件 $("p").hide(); //隐藏事件$("p").hide(1000); //1秒内缓慢隐藏$(" ...
- 【jQuery源码】事件委托
jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作 下面主要分析事 ...
- 【JQuery源码】事件绑定
事件绑定的方式有很多种.使用了jQuery那么原来那种绑定方式(elem.click = function(){...})就不推荐了,原因? 最主要的一个原因是elem.click = fn这种方式只 ...
- 【jQuery源码】事件存储结构
a. jQuery事件原型——Dean Edwards的跨浏览器AddEvent()设计 源码解读 重新梳理一下数据结构,使用一个例子 <input type="text" ...
- 文字添加响应事件,js动态加载CSS, js弹出DIV
文字添加响应事件,js动态加载CSS, js弹出DIV <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
随机推荐
- php拓展ssh功能
1.下载拓展ssh需要的两个软件包,libssh2和ssh2. libssh2下载地址:http://pan.baidu.com/s/1hq7XOhu libssh2官网下载地址:http://www ...
- [译]GotW #1: Variable Initialization 续
Answer 2. 下面每行代码都做了什么? 在Q2中,我们创建了一个vector<int>且传了参数10和20到构造函数中,第一种情况下(10,20),第二种情况是{10, 20}. 它 ...
- [置顶] linux内核启动1-启动参数(启动参数的获取和处理,分析setup_arch)
最近公司要求调试一个内核,启动时有问题,所以就花了一点时间看看内核启动. 看的过程中总结了一点东西,希望可以帮助大家调试内核. 当我开始看的时候,第一件事是从网上搜集资料,不看不知道,一看吓一跳!牛人 ...
- linxu命令小结
1.设置root用户的密码 sudo passwd root 2.切换用户 su username su:switch user的简写 3.切换到超级用户 sudo su sudo (super us ...
- [FJSC2014]圈地
[题目描述] 2维平面上有n个木桩,黄学长有一次圈地的机会并得到圈到的土地,为了体现他的高风亮节,他要使他圈到的土地面积尽量小.圈地需要圈一个至少3个点的多边形,多边形的顶点就是一个木桩,圈得的土地就 ...
- (转载)js----对象直接量
(转载)http://blog.csdn.net/greymouseyu/article/details/4015676 对象直接量提供了另一种创建新对象的方式.对象直接量允许将对象描述文字嵌入到Ja ...
- Grading
100 >= A >= 93 > A- >= 90; 90 > B+ >= 87 > B >= 83 > B- >= 80; 80 > ...
- margin-top 父div下落
解决方法: 1.修改父元素的高度,增加padding-top样式模拟(padding-top:1px:常用) 2.为父元素添加overflow:hidden:样式即可(完美) 3.为父元素或者子元素声 ...
- JavaScript高级程序设计58.pdf
15章 使用Canvas绘图 略 16章 HTML5脚本编程 HTML5规范了新的HTML标记和JavaScript API,以便简化创建动态Web界面的工作 跨文档消息传递 简称XDM,指来自不同域 ...
- UVA 10194 Football (aka Soccer)
Problem A: Football (aka Soccer) The Problem Football the most popular sport in the world (america ...