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实现水平伸缩菜单的更多相关文章

  1. css实现水平伸缩菜单

    ul li a{transition:width 500ms ease;} a:hover{width:*;} 高度向上延伸用height:*;margin-top:-*px;//负值实现向上

  2. JQ写简单的伸缩菜单(内附效果图和源代码)

    效果如图: JQ代码就那么几句, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  3. js屏蔽浏览器右键菜单,粘贴,复制,剪切,选中(转)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 用js枚举实现简易菜单效果

    用js枚举实现简易菜单效果,左侧显示菜单,右侧显示用户选择的菜单,一图胜千言,还是直接来张效果图吧: 以下是代码: <DOCTYPE html> <html> <head ...

  5. Angular.js+Bootstrap实现手风琴菜单

    说是Angular.js+Bootstrap实现手风琴菜单,其实就是用了Bootstrap的样式而已. 上一篇实现了表格+分页,接着学习实现的Demo. 主要练习自定义指令,向指令中传递参数,老规矩先 ...

  6. 下拉的DIV+CSS+JS二级树型菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 重写JS的鼠标右键点击菜单

    重写JS的鼠标右键点击菜单 该效果主要有三点,一是对重写的下拉菜单的隐藏和显示:二是屏蔽默认的鼠标右键事件:三是鼠标左键点击页面下拉菜单隐藏. 不多说,上html代码: 1 <ul id=&qu ...

  8. 原生JS封装创建多级菜单函数

    手写一个使用原生JS封装的多级菜单的函数,满足以下几点需求. 子类层级不确定,可根据数据自动生成多级菜单. 操作便捷,只需传入一个HTML标签. 缺点: 需要满足特定的数据结构 废话不多说,展示代码. ...

  9. 纯css和js版下拉菜单

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. java实现时钟方法汇总

    import java.awt.Dimension; import java.text.SimpleDateFormat; import java.util.Calendar; import java ...

  2. Redis在.NET环境下实践篇(一)

    redis简介 Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,和Memcached类似,它支持存储的value类型相对更多,包括st ...

  3. Vcf文件格式

    Vcf文件格式是GATK钟爱的表示遗传变异的一种文件格式. 就拿GATK给出的vcf例子说明吧,下面这个文件只表示了一个完整vcf文件的前几个SNP. 看上去确实有点复杂,那就把它分为两部分看吧,第一 ...

  4. Python Web框架——Django

    返回顶部 使用框架简单快速开发特定的系统. pip freeze > requirements.txt pip install -r requirements.txt 一 MVC和MTV模式 二 ...

  5. 开始使⽤ZooKeeper的API

    在之前的章节中,我们使用zkCli工具介绍了ZooKeeper的基本操作.从本章开始,我们将会看到在应用中如何通过API来进行操作.首先介绍一下如何使用ZooKeeper的API进行开发,展示如何创建 ...

  6. leetcode384

    public class Solution { private int[] nums; private Random random; public Solution(int[] nums) { thi ...

  7. 使用PowerMap生成地图图文

    地区    GDP(亿)广东省    80854江苏省    77388山东省    68024浙江省    47251河南省    40471四川省    32934湖北省    32665河北省  ...

  8. 使用Vagrant创建多节点虚拟机集群

    摘要: 在前一篇博客中,我介绍了使用Vagrant快速创建虚拟机,但是所创建的只是单个虚拟机.这篇博客将介绍使用Vagrant创建多节点虚拟机集群,可以作为Hadoop,Spark以及Storm等分布 ...

  9. JAVA_01

    Java局部变量 局部变量声明在方法.构造方法或者语句块中: 局部变量在方法.构造方法.或者语句块被执行的时候创建,当它们执行完成后,变量将会被销毁: 访问修饰符不能用于局部变量: 局部变量只在声明它 ...

  10. docker学习记录1

    起因 现在自己学习微服务,服务器越来越多,虽然自己写了一些shell脚本来安装需要的软件,比如mysql,redis,jdk等等,但是还是好麻烦.希望学习docker能够快速安装部署这些东西. 记录一 ...