JQuery 图片的展开和伸缩实例讲解


Posted in Javascript onApril 18, 2013
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<style type="text/css"> 
#img1 
{ 
width:400px; 
height: 400px; 
border: solid 1px #ccc; 
display:none; 
} 
</style> 
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
$('#Button1').click(function () { 
$('#img1').show(5000); //图片的展开 
}) 
$('#Button2').click(function () { 
$('#img1').hide(5000); //图片的伸缩 
}) 
}) 
</script> 
</head> 
<body> 
<img id="img1" src="images/1.jpg" /> 
<input id="Button1" type="button" value="展开图片"/> 
<input id="Button2" type="button" value="收缩图片"/> 
</body> 
</html>
Javascript 相关文章推荐
来自chinaz的ajax获取评论代码
May 03 Javascript
收集的一些Array及String原型对象的扩展实现代码
Dec 05 Javascript
jQuery 遍历- 关于closest() 的方法介绍以及与parents()的方法区别分析
Apr 26 Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
Sep 04 Javascript
基于jQuery Ajax实现上传文件
Mar 24 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
js判断浏览器是否支持严格模式的方法
Oct 04 Javascript
JavaScript常用数组操作方法,包含ES6方法
May 10 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
Aug 21 Javascript
JavaScript JMap类定义与使用方法示例
Jan 22 Javascript
解决Vue+Electron下Vuex的Dispatch没有效果问题
May 20 Javascript
javascript+Canvas实现画板功能
Jun 23 Javascript
jQuery基本选择器选择元素使用介绍
Apr 18 #Javascript
jQuery层次选择器选择元素使用介绍
Apr 18 #Javascript
jQuery基本过滤选择器使用介绍
Apr 18 #Javascript
使用jQuery内容过滤选择器选择元素实例讲解
Apr 18 #Javascript
jQuery随机切换图片的小例子
Apr 18 #Javascript
JS 各种网页尺寸判断实例方法
Apr 18 #Javascript
jQuery 获取URL的GET参数值的小例子
Apr 18 #Javascript
You might like
PHP中ID设置自增后不连续的原因分析及解决办法
2016/08/21 PHP
Laravel实现自定义错误输出内容的方法
2016/10/10 PHP
php实现的pdo公共类定义与用法示例
2017/07/19 PHP
PHP call_user_func和call_user_func_array函数的简单理解与应用分析
2019/11/25 PHP
Laravel 修改验证异常的响应格式实例代码详解
2020/05/25 PHP
PHP ob缓存以及ob函数原理实例解析
2020/11/13 PHP
PHP+Mysql分布式事务与解决方案深入理解
2021/02/27 PHP
用javascript连接access数据库的方法
2006/11/17 Javascript
JavaScript 继承的实现
2009/07/09 Javascript
jQuery点击后一组图片左右滑动的实现代码
2012/08/16 Javascript
JavaScript indexOf方法入门实例(计算指定字符在字符串中首次出现的位置)
2014/10/17 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
jQuery中attr()方法用法实例
2015/01/05 Javascript
Javascript控制div属性动态变化实例分析
2015/10/08 Javascript
JS完成画圆圈的小球
2017/03/07 Javascript
详解nodejs微信公众号开发——3.封装消息响应模块
2017/04/10 NodeJs
bootstrap table单元格新增行并编辑
2017/05/19 Javascript
Angular浏览器插件Batarang介绍及使用
2018/02/07 Javascript
layui的select联动实现代码
2019/09/28 Javascript
Vue 使用beforeEach实现登录状态检查功能
2019/10/31 Javascript
使用vuex较为优雅的实现一个购物车功能的示例代码
2019/12/09 Javascript
[52:41]OG vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/20 DOTA
使用Python的PEAK来适配协议的教程
2015/04/14 Python
python pandas中DataFrame类型数据操作函数的方法
2018/04/08 Python
Python之dict(或对象)与json之间的互相转化实例
2018/06/05 Python
对python列表里的字典元素去重方法详解
2019/01/21 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
Django框架 Pagination分页实现代码实例
2019/09/04 Python
Python Numpy库常见用法入门教程
2020/01/16 Python
详解css3中的伪类before和after常见用法
2020/11/17 HTML / CSS
医科大学生毕业的自我评价分享
2013/11/12 职场文书
巧克力蛋糕店创业计划书
2014/01/14 职场文书
学生生病请假条范文
2014/02/16 职场文书
司机岗位职责说明书
2014/07/29 职场文书
公司老总年会致辞
2015/07/30 职场文书
Java的Object类的九种方法
2022/04/13 Java/Android