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 object array方法使用详解
Dec 03 Javascript
获取客户端网卡MAC地址和IP地址实现JS代码
Mar 17 Javascript
js 页面元素的几个用法总结
Nov 18 Javascript
iScroll.js 使用方法参考
May 16 Javascript
利用node.js写一个爬取知乎妹纸图的小爬虫
May 03 Javascript
vue 文件目录结构详解
Nov 24 Javascript
JS同步、异步、延迟加载的方法
May 05 Javascript
node+express框架中连接使用mysql(经验总结)
Nov 10 Javascript
Vue 无限滚动加载指令实现方法
May 28 Javascript
基于Node.js的大文件分片上传示例
Jun 19 Javascript
ant design vue中表格指定格式渲染方式
Oct 28 Javascript
微信小程序将页面按钮悬浮固定在底部的实现代码
Oct 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
PHP学习之正则表达式
2011/04/17 PHP
PHP文件锁函数flock()详细介绍
2014/11/18 PHP
PHP7生产环境队列Beanstalkd用法详解
2020/05/19 PHP
Mac系统下搭建Nginx+php-fpm实例讲解
2020/12/15 PHP
jquery获取tr中控件值并操作tr实现思路
2013/03/27 Javascript
js实现防止被iframe的方法
2015/07/03 Javascript
jquery+CSS3实现淘宝移动网页菜单效果
2015/08/31 Javascript
完美解决IE9浏览器出现的对象未定义问题
2016/09/29 Javascript
NodeJS、NPM安装配置步骤(windows版本) 以及环境变量详解
2017/05/13 NodeJs
vuejs 单文件组件.vue 文件的使用
2017/07/28 Javascript
JavaScript实现快速排序的方法分析
2018/01/10 Javascript
webpack 4.0.0-beta.0版本新特性介绍
2018/02/10 Javascript
vue使用nprogress实现进度条
2019/12/09 Javascript
Angular6项目打包优化的实现方法
2019/12/15 Javascript
[40:55]Liquid vs LGD 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
Python Web框架Flask中使用新浪SAE云存储实例
2015/02/08 Python
python操作ssh实现服务器日志下载的方法
2015/06/03 Python
Python中动态创建类实例的方法
2017/03/24 Python
python实现微信远程控制电脑
2018/02/22 Python
对python 多线程中的守护线程与join的用法详解
2019/02/18 Python
Python 进程之间共享数据(全局变量)的方法
2019/07/16 Python
Python学习笔记之Break和Continue用法分析
2019/08/14 Python
python爬虫数据保存到mongoDB的实例方法
2020/07/28 Python
海淘零差价,宝贝全球购: 宝贝格子
2016/08/24 全球购物
日本最大的购物网站乐天市场国际版:Rakuten Global Market(支持中文)
2020/02/03 全球购物
建筑专业毕业生推荐信
2013/11/21 职场文书
商务专员岗位职责
2013/11/23 职场文书
珍珠奶茶店创业计划书
2014/01/11 职场文书
公司合作协议书范本
2014/04/18 职场文书
初中班主任评语大全
2014/04/24 职场文书
校园学雷锋广播稿
2014/10/08 职场文书
淘宝好评语句大全
2014/12/31 职场文书
横店影视城导游词
2015/02/06 职场文书
地雷战观后感
2015/06/09 职场文书
2016教师党员学习心得体会
2016/01/21 职场文书
MongoDB误操作后使用oplog恢复数据
2022/04/11 MongoDB