jQuery使用一个按钮控制图片的伸缩实现思路


Posted in Javascript onApril 19, 2013
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<style type="text/css"> 
#img1 
{ 
width: 500px; 
height: 400px; 
border: solid 1px #ccc; 
display:none; 
} 
</style> 
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
var count = 0; 
$(function () { 
$('#Button1').click(function () { 
if (count % 2 != 0) { 
$('#img1').hide(5000); 
} 
else { 
$('#img1').show(5000); 
} 
count++; 
}) 
}) 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<img id="img1" src="images/1.jpg" /> 
<input id="Button1" type="button" value="点我看看" /> 
</div> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
Javascript学习笔记5 类和对象
Jan 11 Javascript
有关JavaScript的10个怪癖和秘密分享
Aug 28 Javascript
Node.js实现的简易网页抓取功能示例
Dec 05 Javascript
谈谈encodeURI和encodeURIComponent以及escape的区别与应用
Nov 24 Javascript
jQuery+css3实现转动的正方形效果(附demo源码下载)
Jan 27 Javascript
详解Node.Js如何处理post数据
Sep 19 Javascript
jQuery简单实现MD5加密的方法
Mar 03 Javascript
Bootstrap学习笔记之进度条、媒体对象实例详解
Mar 09 Javascript
JavaScript实现反转字符串的方法详解
Apr 27 Javascript
javaScript手机号码校验工具类PhoneUtils详解
Dec 08 Javascript
vue中本地静态图片路径写法
Mar 06 Javascript
Node.js操作系统OS模块用法分析
Jan 04 Javascript
使用jQuery同时控制四张图片的伸缩实现代码
Apr 19 #Javascript
使用jQuery实现的网页版的个人简历(可换肤)
Apr 19 #Javascript
兼容IE和Firefox火狐的上下、左右循环无间断滚动JS代码
Apr 19 #Javascript
JS实现div内部的文字或图片自动循环滚动代码
Apr 19 #Javascript
Jquery实现页面加载时弹出对话框代码
Apr 19 #Javascript
jQuery阻止同类型事件小结
Apr 19 #Javascript
基于JavaScript 数据类型之Boolean类型分析介绍
Apr 19 #Javascript
You might like
曾在DC漫画界反派角色扮演的演员,谁才是你心目中的小丑之王?
2020/04/09 欧美动漫
详解php魔术方法(Magic methods)的使用方法
2016/02/14 PHP
Joomla实现组件中弹出一个模式(modal)窗口的方法
2016/05/04 PHP
PHP从零开始打造自己的MVC框架之路由类实现方法分析
2019/06/03 PHP
解决php扩展安装不生效问题
2019/10/25 PHP
javascript 三种编解码方式
2010/02/01 Javascript
Chrome Form多次提交表单问题的解决方法
2011/05/09 Javascript
js里怎么取select标签里的值并修改
2012/12/10 Javascript
js字符串转换成xml对象并使用技巧解读
2013/04/18 Javascript
关于延迟加载JavaScript
2015/05/05 Javascript
浅谈Javascript的静态属性和原型属性
2015/05/07 Javascript
$.extend 的一个小问题
2015/06/18 Javascript
vue.js实现数据动态响应 Vue.set的简单应用
2017/06/15 Javascript
React Native AsyncStorage本地存储工具类
2017/10/24 Javascript
vue移动端实现手机左右滑动入场动画
2020/06/17 Javascript
微信小程序监听用户登录事件的实现方法
2019/11/11 Javascript
JS函数进阶之prototy用法实例分析
2020/01/15 Javascript
[01:11:28]DOTA2-DPC中国联赛定级赛 RNG vs Phoenix BO3第一场 1月8日
2021/03/11 DOTA
Python中列表的一些基本操作知识汇总
2015/05/20 Python
Python使用gensim计算文档相似性
2016/04/10 Python
Python获取当前公网ip并自动断开宽带连接实例代码
2018/01/12 Python
PyQt5根据控件Id获取控件对象的方法
2019/06/25 Python
Python实现手机号自动判断男女性别(实例解析)
2019/12/22 Python
python图形开发GUI库wxpython使用方法详解
2020/02/14 Python
Python函数的迭代器与生成器的示例代码
2020/06/18 Python
python实现代码审查自动回复消息
2021/02/01 Python
美国女性卫生用品公司:Thinx
2017/06/30 全球购物
英国花园家具中心:Garden Furniture Centre
2017/08/24 全球购物
西班牙香水和化妆品连锁店:Druni
2019/05/05 全球购物
介绍一下.NET构架下remoting和webservice
2014/05/08 面试题
介绍一下linux的文件系统
2015/10/06 面试题
银行会计业务的个人自我评价
2013/11/02 职场文书
2014年社区卫生工作总结
2014/12/18 职场文书
人才市场接收函
2015/01/30 职场文书
二年级数学教学反思
2016/02/16 职场文书
MySQL去除重叠时间求时间差和的实现
2021/08/23 MySQL