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代码
Dec 01 Javascript
js判断元素是否隐藏的方法
Jun 09 Javascript
jquery.map()方法的使用详解
Jul 09 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
Jan 27 Javascript
Angularjs实现多个页面共享数据的方式
Mar 29 Javascript
jQuery实现的可编辑表格完整实例
Jun 20 Javascript
JS实现的跨浏览器解析XML文件实例
Jun 21 Javascript
Jquery删除css属性的简单方法
Dec 04 Javascript
Bootstrap提示框效果的实例代码
Jul 12 Javascript
JavaScript使用Ajax上传文件的示例代码
Aug 10 Javascript
JS使用正则表达式提交页面验证的代码
Oct 16 Javascript
Vue的click事件防抖和节流处理详解
Nov 13 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多线程抓取网页实现代码
2010/07/22 PHP
php引用地址改变变量值的问题
2012/03/23 PHP
用 Composer构建自己的 PHP 框架之基础准备
2014/10/30 PHP
php学习笔记之基础知识
2014/11/08 PHP
php使用PDO方法详解
2014/12/27 PHP
PHP中的traits简单使用实例
2015/05/13 PHP
laravel orm 关联条件查询代码
2019/10/21 PHP
window.location.href中url中数据量太大时的解决方法
2013/12/23 Javascript
JS访问SWF的函数用法实例
2015/07/01 Javascript
跟我学习javascript的Date对象
2015/11/19 Javascript
学习Javascript面向对象编程之封装
2016/02/23 Javascript
jQuery的框架介绍
2016/05/11 Javascript
AngularJS 实现弹性盒子布局的方法
2016/08/30 Javascript
JS实现页面载入时随机显示图片效果
2016/09/07 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
vue-cli中vue本地实现跨域调试接口
2019/01/16 Javascript
简述Vue中容易被忽视的知识点
2019/12/09 Javascript
微信小程序实现列表的横向滑动方式
2020/07/15 Javascript
Vue使用轮询定时发送请求代码
2020/08/10 Javascript
python 中的列表解析和生成表达式
2011/03/10 Python
python3+PyQt5使用数据库窗口视图
2018/04/24 Python
使用pandas对两个dataframe进行join的实例
2018/06/08 Python
Python 中的range(),以及列表切片方法
2018/07/02 Python
python 中xpath爬虫实例详解
2019/08/26 Python
python基于exchange函数发送邮件过程详解
2020/11/06 Python
俄罗斯小米家用电器、电子产品和智能家居商店:Poood.ru
2020/04/03 全球购物
当当网软件测试笔试题
2015/11/24 面试题
共产党员公开承诺书范文
2014/03/28 职场文书
亲属关系公证书
2014/04/08 职场文书
师德师风个人反思
2014/04/28 职场文书
应届大专生求职信
2014/06/26 职场文书
信用卡工作证明模板
2014/09/14 职场文书
学校党风廉政建设调研报告
2015/01/01 职场文书
2015年暑假工作总结
2015/07/13 职场文书
个人道歉信大全
2019/04/11 职场文书
Python机器学习之基于Pytorch实现猫狗分类
2021/06/08 Python