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 相关文章推荐
用js重建星际争霸
Dec 22 Javascript
WordPress 照片lightbox效果的运用几点
Jun 22 Javascript
页面回到顶部的三种实现(锚标记,js)
Oct 01 Javascript
JS实现距离上次刷新已过多少秒示例
May 23 Javascript
javascript制作的滑动图片菜单
May 15 Javascript
js和C# 时间日期格式转换的简单实例
May 28 Javascript
AngularJs Modules详解及示例代码
Sep 01 Javascript
JavaScript自定义函数实现查找两个字符串最长公共子串的方法
Nov 24 Javascript
ES6概念 ymbol.for()方法
Dec 25 Javascript
Jil,高效的json序列化和反序列化库
Feb 15 Javascript
纯jQuery实现前端分页功能
Mar 23 jQuery
Angular请求防抖处理第一次请求失效问题
May 17 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调用mysql数据 dbclass类
2011/05/07 PHP
php空间不支持socket但支持curl时recaptcha的用法
2011/11/07 PHP
两种php去除二维数组的重复项方法
2015/11/04 PHP
PHP中in_array的隐式转换的解决方法
2018/03/06 PHP
thinkPHP5框架实现基于ajax的分页功能示例
2018/06/12 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
浅谈laravel-admin的sortable和orderby使用问题
2019/10/03 PHP
一个支付页面DEMO附截图
2014/07/22 Javascript
js+css实现打字效果
2020/06/24 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
2019/05/17 jQuery
VUE路由动态加载实例代码讲解
2019/08/26 Javascript
layer实现弹出层自动调节位置
2019/09/05 Javascript
python使用sorted函数对列表进行排序的方法
2015/04/04 Python
python中的闭包用法实例详解
2015/05/05 Python
python fabric实现远程部署
2017/01/05 Python
利用Python实现Windows下的鼠标键盘模拟的实例代码
2017/07/13 Python
python 字典中取值的两种方法小结
2018/08/02 Python
Python实现监控键盘鼠标操作示例【基于pyHook与pythoncom模块】
2018/09/04 Python
Python文件读写常见用法总结
2019/02/22 Python
Python面向对象进阶学习
2019/05/21 Python
python对常见数据类型的遍历解析
2019/08/27 Python
纯css3实现宠物小鸡实例代码
2018/10/08 HTML / CSS
input元素的url类型和email类型简介
2012/07/11 HTML / CSS
UGG澳洲官网:UGG Australia
2018/04/26 全球购物
List, Set, Map是否继承自Collection接口?
2016/05/16 面试题
电焊工工作岗位职责
2014/02/06 职场文书
保险公司晨会主持词
2014/03/22 职场文书
2014年征兵标语
2014/06/20 职场文书
尊老爱亲美德少年事迹材料
2014/08/14 职场文书
公司领导班子对照材料
2014/08/18 职场文书
清洁工岗位职责
2015/02/13 职场文书
自信主题班会
2015/08/14 职场文书
私人贷款担保书该怎么写呢?
2019/07/02 职场文书
go语言基础 seek光标位置os包的使用
2021/05/09 Golang
React Native项目框架搭建的一些心得体会
2021/05/28 Javascript
MySQL事务的隔离级别详情
2022/07/15 MySQL