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 相关文章推荐
兼容IE/Firefox/Opera/Safari的检测页面装载完毕的脚本Ext.onReady的实现
Jul 14 Javascript
基于jquery的分页控件(C#)
Jan 06 Javascript
javascript的解析执行顺序在各个浏览器中的不同
Mar 17 Javascript
第十章之巨幕页头缩略图与警告框组件
Apr 25 Javascript
简述Angular 5 快速入门
Nov 04 Javascript
Vue2.0系列之过滤器的使用
Mar 01 Javascript
nuxt框架中对vuex进行模块化设置的实现方法
Sep 06 Javascript
JS数组方法concat()用法实例分析
Jan 18 Javascript
卸载vue2.0并升级vue_cli3.0的实例讲解
Feb 16 Javascript
简单了解JavaScript弹窗实现代码
May 07 Javascript
JavaScript 判断数据类型的4种方法
Sep 11 Javascript
Nest.js参数校验和自定义返回数据格式详解
Mar 29 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
ThinkPHP处理Ajax返回的方法
2014/11/22 PHP
PHP面向对象程序设计之对象的遍历操作示例
2019/06/12 PHP
PHP7生产环境队列Beanstalkd用法详解
2020/05/19 PHP
制作特殊字的脚本
2006/06/26 Javascript
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
qq悬浮代码(兼容各个浏览器)
2014/01/29 Javascript
使用javascript做的一个随机点名程序
2014/02/13 Javascript
js实现固定显示区域内自动缩放图片的方法
2015/07/18 Javascript
深入学习JavaScript对象
2015/10/13 Javascript
JS中判断字符串中出现次数最多的字符及出现的次数的简单实例
2016/06/03 Javascript
深入理解js generator数据类型
2016/08/16 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
2017/12/19 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
2018/09/01 Javascript
Vue用v-for给循环标签自身属性添加属性值的方法
2018/10/18 Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
2020/04/07 Javascript
react 不用插件实现数字滚动的效果示例
2020/04/14 Javascript
python executemany的使用及注意事项
2017/03/13 Python
PyQt 线程类 QThread使用详解
2017/07/16 Python
Python使用itchat 功能分析微信好友性别和位置
2019/08/05 Python
python django model联合主键的例子
2019/08/06 Python
Python学习笔记之函数的定义和作用域实例详解
2019/08/13 Python
python调用接口的4种方式代码实例
2019/11/19 Python
Anaconda使用IDLE的实现示例
2020/09/23 Python
python可视化 matplotlib画图使用colorbar工具自定义颜色
2020/12/07 Python
利用CSS3实现单选框动画特效示例代码
2016/09/26 HTML / CSS
英国领先的露营和露营车品牌之一:OLPRO
2019/08/06 全球购物
乌克兰移动电子产品和相关配件的在线商店:iTMag
2020/03/16 全球购物
学校总务处领导干部个人对照检查材料思想汇报
2014/10/06 职场文书
教师党员批评与自我批评
2014/10/15 职场文书
个人股份转让协议书范本
2014/10/26 职场文书
2015年化工厂工作总结
2015/05/04 职场文书
2015年仓库管理工作总结
2015/05/25 职场文书
zabbix agent2 监控oracle数据库的方法
2021/05/13 Oracle
Java实现二维数组和稀疏数组之间的转换
2021/06/27 Java/Android
使用 CSS 轻松实现一些高频出现的奇形怪状按钮
2021/12/06 HTML / CSS
聊聊Python String型列表求最值的问题
2022/01/18 Python