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 相关文章推荐
Prototype Object对象 学习
Jul 12 Javascript
javascript jscroll模拟html元素滚动条
Dec 18 Javascript
JS实现字体选色板实例代码
Nov 20 Javascript
Javascript实现图片轮播效果(一)让图片跳动起来
Feb 17 Javascript
jQuery原理系列-css选择器的简单实现
Jun 07 Javascript
Angular4的输入属性与输出属性实例详解
Nov 29 Javascript
vue中使用gojs/jointjs的示例代码
Aug 24 Javascript
详解JavaScript 浮点数运算的精度问题
Jul 23 Javascript
一篇文章弄懂javascript中的执行栈与执行上下文
Aug 09 Javascript
layui.tree组件的使用以及搜索节点功能的实现
Sep 26 Javascript
vue 取出v-for循环中的index值实例
Nov 09 Javascript
浅谈JavaScript窗体Window.ShowModalDialog使用
Jul 22 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
DedeCMS 核心类TypeLink.class.php摘要笔记
2010/04/07 PHP
对JavaScript的eval()中使用函数的进一步讨论
2008/07/26 Javascript
多浏览器兼容的获取元素和鼠标的位置的js代码
2009/12/15 Javascript
js 效率组装字符串 StringBuffer
2009/12/23 Javascript
jQuery的Ajax的自动完成功能控件简要说明
2013/02/22 Javascript
Tab切换组件(选项卡功能)实例代码
2013/11/21 Javascript
javascript实现的HashMap类代码
2014/06/27 Javascript
JQuery对表单元素的基本操作使用总结
2014/07/18 Javascript
javascript使用正则获取url上的某个参数
2014/09/04 Javascript
JavaScript插件化开发教程(五)
2015/02/01 Javascript
IE及IE6浏览器中判断JS文件加载成功失败的方法
2015/02/18 Javascript
利用jquery实现瀑布流3种案例
2016/09/18 Javascript
Javascript 闭包详解及实例代码
2016/11/30 Javascript
Bootstrap基本插件学习笔记之模态对话框(16)
2016/12/08 Javascript
Vue + Webpack + Vue-loader学习教程之功能介绍篇
2017/03/14 Javascript
js判断节假日实例代码
2017/12/27 Javascript
小程序点餐界面添加购物车左右摆动动画
2020/09/23 Javascript
微信小程序自定义modal弹窗组件的方法详解
2020/12/20 Javascript
[56:14]Fnatic vs OG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python检测远程服务器tcp端口的方法
2015/03/14 Python
Python简单的制作图片验证码实例
2017/05/31 Python
Python小进度条显示代码
2019/03/05 Python
一文了解Python并发编程的工程实现方法
2019/05/31 Python
Elasticsearch py客户端库安装及使用方法解析
2020/09/14 Python
python实现自动打卡的示例代码
2020/10/10 Python
Kent & Curwen:与大卫·贝克汉姆合作
2017/06/13 全球购物
Laura Mercier官网:彩妆大师罗拉玛斯亚的化妆品牌
2018/01/04 全球购物
中国电子产品批发商/跨境电商/外贸网:Sunsky-online
2020/04/20 全球购物
计算机专业推荐信范文
2013/11/27 职场文书
班级入场式解说词
2014/02/01 职场文书
《小壁虎借尾巴》教学反思
2014/02/16 职场文书
家长给学校的建议书
2014/05/15 职场文书
环境工程专业自荐信范文
2014/06/24 职场文书
物业工程部经理岗位职责
2015/04/09 职场文书
2016年党员公开承诺书格式范文
2016/03/24 职场文书
python如何将mat文件转为png
2022/07/15 Python