jquery应用实例分享_实现手风琴特效
时间:2019-04-13
本文章向大家介绍jquery应用实例分享_实现手风琴特效,主要包括jquery应用实例分享_实现手风琴特效使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
效果:
实例如下所示:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{padding: 0px;margin: 0px;} li{ width: 80px;height:300px; float: left;overflow: hidden; list-style: none; } </style> <script type="text/javascript "src="http://code.jquery.com/jquery-1.10.2.min.js"></script> </head> <body> <script > $(function () { $("ul li").mouseover(function (){ $(this).stop().animate({width:350},500)//stop函数:停止当前正在运行的动画 //siblings:遍历 $(this).siblings().stop().animate({width:80},500)//anmate:500ms后将其width变为80px; }) }) </script> <div> <ul> <li style="width: 350px"><img src="1.jpg"></li> <li><img src="2.jpg"></li> <li><img src="3.jpg"></li> <li><img src="4.jpg"></li> <li><img src="5.jpg"></li> </ul> </div> </body> </html>
以上这篇jquery应用实例分享_实现手风琴特效就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
- 为Symfony2和Redis正名,基于PHP的10亿请求/周网站打造
- 如何使用Python基线预测进行时间序列预测
- 如何使用统计显着性检验来解释机器学习结果
- 其实添加数据也可以这样简单——表单的第一步抽象(针对数据访问层)《怪怪设计论: 抽象无处不在 》有感
- WCF服务端运行时架构体系详解[上篇]
- 使命必达: 深入剖析WCF的可靠会话[编程篇](下)
- 在网页里让文本框只能输入数字的一种方法。外加回车换Tab
- 如何用Python从零开始实现简单的线性回归
- 使命必达: 深入剖析WCF的可靠会话[编程篇](上)
- 页面回发后,让页面自动滚动到指定位置的一种简单的方法
- [自定义服务器控件] 第二步:下拉列表框。
- WCF服务端运行时架构体系详解[中篇]
- [自定义服务器控件] 第三步:CheckBoxList。
- 用Keras通过Python进行卷积神经网络的手写数字识别
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Android 天气APP(二十八)地图搜索定位
- DevEco Studio项目构建讲解、编写页面、布局介绍、页面跳转
- Android 天气APP(二十九)壁纸设置、图片查看、图片保存
- Chrome 私人珍藏-stylus插件实现个性化百度界面定制
- Python 基础篇-简单的异常捕获
- Python 技巧篇-让我的程序暂停一下
- Python+selenium 技术篇-浏览器后台运行
- Python 基础篇-python3安装pyHook和pywin32库
- 漫画:如何螺旋遍历二维数组?(修订版)
- 一文快速入门分库分表(必修课)
- 写出漂亮 Python 代码的 20条准则
- 简单red5+obs推流实现直播系统开发,具体设置介绍
- 使用pandas进行数据快捷加载
- 关于 JavaScript 中 null 的一切
- 总结 | DataFrame、Series、array、tensor的创建及相互转化