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 相关文章推荐
jquery获取自定义属性(attr和prop)实例介绍
Apr 21 Javascript
Jquery实现控件的隐藏和显示实例
Feb 08 Javascript
介绍JavaScript中Math.abs()方法的使用
Jun 14 Javascript
简述AngularJS的控制器的使用
Jun 16 Javascript
理解JS事件循环
Jan 07 Javascript
JavaScript递归操作实例浅析
Oct 31 Javascript
jquery+ajax实现省市区三级联动效果简单示例
Jan 04 Javascript
基于JavaScript实现移动端无限加载分页
Mar 27 Javascript
Vue使用vue-area-linkage实现地址三级联动效果的示例
Jun 27 Javascript
Vue项目中最新用到的一些实用小技巧
Nov 06 Javascript
javascript实现超好看的3D烟花特效
Jan 01 Javascript
如何实现echarts markline标签名显示自己想要的
Jul 20 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
php抓取页面的几种方法详解
2013/06/17 PHP
Thinkphp中Create方法深入探究
2014/06/16 PHP
php实现比较全的数据库操作类
2015/06/18 PHP
yii gridview实现时间段筛选功能
2017/08/15 PHP
PHP使用两个栈实现队列功能的方法
2018/01/15 PHP
php实现微信分享朋友链接功能
2019/02/18 PHP
父子窗体间传递JSON格式的数据的代码
2010/12/25 Javascript
jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果
2011/11/30 Javascript
JS判断表单输入是否为空(示例代码)
2013/12/23 Javascript
js使用html()或text()方法获取设置p标签的显示的值
2014/08/01 Javascript
使用jQuery Ajax 请求webservice来实现更简练的Ajax
2016/08/04 Javascript
详解Jquery 遍历数组之$().each方法与$.each()方法介绍
2017/01/09 Javascript
Vue2.0表单校验组件vee-validate的使用详解
2017/05/02 Javascript
使用jQuery实现动态添加小广告
2017/07/11 jQuery
js实现移动端导航点击自动滑动效果
2017/07/18 Javascript
vue中如何创建多个ueditor实例教程
2017/11/14 Javascript
在Vue组件中使用 TypeScript的方法
2018/02/28 Javascript
Vue项目查看当前使用的elementUI版本的方法
2018/09/27 Javascript
Vue.js实现备忘录功能
2019/06/26 Javascript
详解Vue中CSS样式穿透问题
2019/09/12 Javascript
vue使用nprogress实现进度条
2019/12/09 Javascript
Python中__new__与__init__方法的区别详解
2015/05/04 Python
python爬取拉勾网职位数据的方法
2018/01/24 Python
pandas 读取各种格式文件的方法
2018/06/22 Python
pytorch 自定义卷积核进行卷积操作方式
2019/12/30 Python
Python爬虫库BeautifulSoup获取对象(标签)名,属性,内容,注释
2020/01/25 Python
python中可以声明变量类型吗
2020/06/18 Python
详解matplotlib中pyplot和面向对象两种绘图模式之间的关系
2021/01/22 Python
Pycharm制作搞怪弹窗的实现代码
2021/02/19 Python
Eastbay官网:美国最大的运动鞋网络零售商
2016/07/27 全球购物
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
装潢设计专业推荐信模板
2013/11/26 职场文书
高中生班主任评语
2014/04/25 职场文书
蛋糕店创业计划书
2014/05/06 职场文书
2014党员学习《反腐倡廉警示教育读本》思想汇报
2014/09/13 职场文书
python实现的web监控系统
2021/04/27 Python