js实现水平伸缩菜单
window.onload=function(){
var aA=document.getElementsByTagName('a');
for(var i=0; i<aA.length; i++){
aA[i].onmouseover=function(){
var This=this;
clearInterval(This.time);
This.time=setInterval(function(){
This.style.width=This.offsetWidth+8+"px";
if(This.offsetWidth>=160)
clearInterval(This.time);
},30)
}
aA[i].onmouseout=function(){
clearInterval(this.time);
var This=this;
this.time=setInterval(function(){
This.style.width=This.offsetWidth-8+"px";
if(This.offsetWidth<=120){
This.style.width='120px';
clearInterval(This.time);
}
},30)
}
}
}
js实现水平伸缩菜单的更多相关文章
- css实现水平伸缩菜单
ul li a{transition:width 500ms ease;} a:hover{width:*;} 高度向上延伸用height:*;margin-top:-*px;//负值实现向上
- JQ写简单的伸缩菜单(内附效果图和源代码)
效果如图: JQ代码就那么几句, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- js屏蔽浏览器右键菜单,粘贴,复制,剪切,选中(转)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 用js枚举实现简易菜单效果
用js枚举实现简易菜单效果,左侧显示菜单,右侧显示用户选择的菜单,一图胜千言,还是直接来张效果图吧: 以下是代码: <DOCTYPE html> <html> <head ...
- Angular.js+Bootstrap实现手风琴菜单
说是Angular.js+Bootstrap实现手风琴菜单,其实就是用了Bootstrap的样式而已. 上一篇实现了表格+分页,接着学习实现的Demo. 主要练习自定义指令,向指令中传递参数,老规矩先 ...
- 下拉的DIV+CSS+JS二级树型菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 重写JS的鼠标右键点击菜单
重写JS的鼠标右键点击菜单 该效果主要有三点,一是对重写的下拉菜单的隐藏和显示:二是屏蔽默认的鼠标右键事件:三是鼠标左键点击页面下拉菜单隐藏. 不多说,上html代码: 1 <ul id=&qu ...
- 原生JS封装创建多级菜单函数
手写一个使用原生JS封装的多级菜单的函数,满足以下几点需求. 子类层级不确定,可根据数据自动生成多级菜单. 操作便捷,只需传入一个HTML标签. 缺点: 需要满足特定的数据结构 废话不多说,展示代码. ...
- 纯css和js版下拉菜单
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- java代码---------比较随机数的大小---我搞不懂啊
总结:不习惯你在或不在的时候,赶紧走吧 package com.mmm; import java.util.Random; public class wW { public static double ...
- DataTables warning: table id=DataTables_Table_0 - Requested unknown parameter '1' for row 0. For more information about this error, please see http://datatables.net/tn/4
今天在做后台的时候,考虑到会员模块和订单模块列表显示差不多,于是乎,偷了个懒,把会员列表显示页面的代码拷贝了过来,修改了一下,变成了订单模块.可是,在订单列表显示的时候老是报下面的错误,截图如下: 后 ...
- 《Java核心技术》 -- 读书笔记 ① - 预热
引言 之前通过网上的实例自己使用了Java的一些技术及轮子快速的的“烂“造了一些小应用,但是毕竟没有认真地了解和认知Java,遂打算花一个月左右的时间来细细品味一下... 从头开始,慢慢深入!! Ja ...
- SVN的学习
SVN是Subversion的简称,是一个开放源代码的版本控制系统,相较于CVS,它采用了分支管理系统,它的设计目标就是取代CVS 为什么需要SVN 通常软件开发由多人协作开发,如果对代码文件.配置文 ...
- ArraySort--冒泡排序、选择排序、插入排序工具类demo
public class ArraySort { private long[] a; private int nElems; public ArraySort(int max){ a=new long ...
- CDN之多边缘节点负载均衡--学习笔记
一.剧情 剧情是这样的,本次的多边缘节点负载均衡实验,1个LVS四层负载均衡集群和1个Nginx为反向代理的七层负载均衡集群,由Bind dns解析作为 主负载均衡服务器,调度两个集群,中间层有一台W ...
- 浅谈OPP
了解Java或C#等面向对象编程语言的的程序员比较熟悉类和对象以及OOP. 一谈起OOP,就会想起教科书式的OOP概念:封装.继承.多态.粗浅的解释封装就是对数据进行隐藏:继承就是子类继承父类(cla ...
- Python小知识点(2)
1.简述Python的运行过程 在说这个问题之前,我们先来说两个概念,PyCodeObject和pyc文件. 我们在硬盘上看到的pyc自然不必多说,而其实PyCodeObject则是Python编译器 ...
- delphi IOS BLE 代理
代理方法 centralManagerDidUpdateState: peripheralManagerDidUpdateState:代理方法. centralManager:willRestoreS ...
- bootstrap 自定义
在ror工程内 /app/assets/stylesheets/bootstrap_and_overrides.css.less 内覆盖内容 具体参数如下 https://github.com/twb ...