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 多级checkbox选择效果
Aug 20 Javascript
编写自己的jQuery插件简单实现代码
Apr 19 Javascript
jQuery 数据缓存模块进化史详细介绍
Nov 19 Javascript
通过遮罩层实现浮层DIV登录的js代码
Feb 07 Javascript
使用Node.js实现一个简单的FastCGI服务器实例
Jun 09 Javascript
node.js中的buffer.Buffer.byteLength方法使用说明
Dec 10 Javascript
jquery 实现滚动条下拉时无限加载的简单实例
Jun 01 Javascript
解析javascript图片懒加载与预加载的分析总结
Oct 27 Javascript
node使用UEditor富文本编辑器的方法实例
Jul 11 Javascript
vue实现word,pdf文件的导出功能
Jul 31 Javascript
ES6 let和const定义变量与常量的应用实例分析
Jun 27 Javascript
微信小程序实现手指拖动选项排序
Apr 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
用PHP连接MySQL代码的参数说明
2008/06/07 PHP
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
神奇的7个jQuery 3D插件整理
2011/01/06 Javascript
JavaScript高级程序设计 阅读笔记(十八) js跨平台的事件
2012/08/14 Javascript
js控制frameSet示例
2013/09/10 Javascript
将input file的选择的文件清空的两种解决方案
2013/10/21 Javascript
jQuery 鼠标经过(hover)事件的延时处理示例
2014/04/14 Javascript
js通过iframe加载外部网页的实现代码
2015/04/05 Javascript
学习JavaScript设计模式之状态模式
2016/01/08 Javascript
js动态添加的DIV中的onclick事件简单实例
2016/07/25 Javascript
js中el表达式的使用和非空判断方法
2018/03/28 Javascript
JavaScript设计模式之装饰者模式定义与应用示例
2018/07/25 Javascript
在小程序中集成redux/immutable/thunk第三方库的方法
2018/08/12 Javascript
mpvue中使用flyjs全局拦截的实现代码
2018/09/13 Javascript
vue中的inject学习教程
2019/04/24 Javascript
[02:40]DOTA2殁境神蚀者 英雄基础教程
2013/11/26 DOTA
python使用calendar输出指定年份全年日历的方法
2015/04/04 Python
Python 编码处理-str与Unicode的区别
2016/09/06 Python
图解Python变量与赋值
2018/04/03 Python
Python 爬虫之Beautiful Soup模块使用指南
2018/07/05 Python
Python3.8中使用f-strings调试
2019/05/22 Python
Anaconda之conda常用命令介绍(安装、更新、删除)
2019/10/06 Python
python3.7将代码打包成exe程序并添加图标的方法
2019/10/11 Python
python实现翻译word表格小程序
2020/02/27 Python
如何理解Python中包的引入
2020/05/29 Python
python获取系统内存占用信息的实例方法
2020/07/17 Python
Python实现Canny及Hough算法代码实例解析
2020/08/06 Python
Numpy数组的广播机制的实现
2020/11/03 Python
HTML5中的Scoped属性使用实例
2014/04/23 HTML / CSS
在html页面中取得session中的值的方法
2020/08/11 HTML / CSS
MAC Cosmetics巴西官方网站:M·A·C彩妆
2019/04/18 全球购物
国际贸易个人求职信范文
2014/01/04 职场文书
前台文员职责范本
2014/03/07 职场文书
体育教育毕业生自荐信
2014/06/29 职场文书
小学班主任工作经验交流材料
2015/11/02 职场文书
文艺部部长竞选稿
2015/11/21 职场文书