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 相关文章推荐
通过js脚本复制网页上的一个表格的不错实现方法
Dec 29 Javascript
Prototype Array对象 学习
Jul 19 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
Apr 08 Javascript
基于jquery实现等比缩放图片
Dec 03 Javascript
详解JS正则replace的使用方法
Mar 06 Javascript
JavaScript重定向URL参数的两种方法小结
Oct 19 Javascript
webpack3之loader全解析
Oct 26 Javascript
浅谈Vue SPA 首屏加载优化实践
Dec 15 Javascript
使用socket.io实现简单聊天室案例
Jan 02 Javascript
微信小程序自定义组件的实现方法及自定义组件与页面间的数据传递问题
Oct 09 Javascript
深入探讨JavaScript的最基本部分之执行上下文
Feb 12 Javascript
使用vuex存储用户信息到localStorage的实例
Nov 11 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小马小结(方便查找后门的朋友)
2012/05/05 PHP
PHP缓存技术的多种方法小结
2012/08/14 PHP
PHP获取网址的顶级域名函数代码
2012/09/24 PHP
php 过滤英文标点符号及过滤中文标点符号代码
2014/06/12 PHP
destoon实现公司新闻详细页添加评论功能的方法
2014/07/15 PHP
php面向对象中static静态属性和静态方法的调用
2015/02/08 PHP
PHP判断文件是否被引入的方法get_included_files用法示例
2016/11/29 PHP
thinkphp3.2.0 setInc方法 源码全面解析
2018/01/29 PHP
Laravel学习笔记之Artisan命令生成自定义模板的方法
2018/11/22 PHP
Laravel框架查询构造器 CURD操作示例
2019/09/04 PHP
PHP中关于php.ini参数优化详解
2020/02/28 PHP
javascript 写的一个简单的timer
2009/07/30 Javascript
js Date概念详细介绍
2013/11/22 Javascript
js获取当前地址 JS获取当前URL的示例代码
2014/02/26 Javascript
3种Jquery限制文本框只能输入数字字母的方法
2014/12/03 Javascript
再次谈论Javascript中的this
2016/06/23 Javascript
AngularJS中的按需加载ocLazyLoad示例
2017/01/11 Javascript
Javascript基础回顾之(三) js面向对象
2017/01/31 Javascript
Vue-cli 使用json server在本地模拟请求数据的示例代码
2017/11/02 Javascript
vue路由嵌套的SPA实现步骤
2017/11/06 Javascript
vue 使用饿了么UI仿写teambition的筛选功能
2021/03/01 Vue.js
[03:58]兄弟们,回来开黑了!DOTA2昔日战友招募宣传视频
2016/07/17 DOTA
[44:01]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS paiN
2018/03/31 DOTA
详解Python中 sys.argv[]的用法简明解释
2017/12/20 Python
Python告诉你木马程序的键盘记录原理
2019/02/02 Python
使用python实现名片管理系统
2020/06/18 Python
python利用tkinter实现图片格式转换的示例
2020/09/28 Python
HTML5实现WebSocket协议原理浅析
2014/07/07 HTML / CSS
HTML5在线预览PDF的示例代码
2017/09/14 HTML / CSS
编程输出如下图形
2013/11/24 面试题
副科级后备干部考察材料
2014/05/15 职场文书
中小学校园安全广播稿
2014/09/29 职场文书
整改报告格式
2014/11/06 职场文书
征求意见函
2015/06/05 职场文书
小学科学课教学反思
2016/02/23 职场文书
MySQL创建索引需要了解的
2021/04/08 MySQL