js兼容IE6,IE7菜单高亮显示效果代码

兼容IE6,IE7菜单高亮显示

*{
font:12px tahoma;
}
#menu li{
list-style:none;
width:88px;
height:30px;
float:left;
background:#EFF1F5;
text-align:center;
margin:0;
overflow:hidden;

}
#menu li a{
display:block;

}
#menu li a:link,#menu li a:visited{
text-decoration:none;
padding:8px 0;
}
#menu li a:hover{
background:#B8C0D3;
}

  • 我们
  • 我们
  • 我们
  • 我们
  • 我们
  • 我们

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

时间: 2008-06-30

js 全兼容可高亮二级缓冲折叠菜单

在后台或OA系统中最常用到的布局往往是一个全屏布局,一般都是上中下三行两列布局,页头.页脚.左侧菜单加一个右侧ifame框架页.所以那种带折叠的二级菜单是会经常使用到的,本例便是实现这样一种比较通用的全兼容可高亮二级缓冲折叠菜单. 特点: 全兼容,浏览器测试:IE5.5.IE6.IE7.IE8.FF3.0.谷歌.Safari 4.0.Opera9.0. Html结构优雅简洁,无多余标签,利于程序循环输出. 样式与结构分离,你可以在样式表中修改不同的风格. 当前选中项高亮状态,一级菜单和二级菜单都

jQuery实现可高亮显示的二级CSS菜单效果

本文实例讲述了jQuery实现可高亮显示的二级CSS菜单效果.分享给大家供大家参考.具体如下: 这里实现鼠标放在二级菜单上,一级菜单可高亮显示,以指示当前菜单所在的位置,引入了jQuery插件使其在做对简洁度方面优化的非常好,用较少的代码实现想要的功能,分享给大家. 先来看看运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-color-show-2level-css-menu-codes/ 具体代码如下: <!DOCTYPE html P

yii2框架中使用下拉菜单的自动搜索yii-widget-select2实例分析

本文实例讲述了yii2框架中使用下拉菜单的自动搜索yii-widget-select2的方法.分享给大家供大家参考,具体如下: github中源代码地址:https://github.com/kartik-v/yii2-widget-select2 利用composer.phar安装此插件: php composer.phar require kartik-v/yii2-widget-select2 "*" 引用方法: use kartik\select2\Select2; 源代码:

jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果

本文实例讲述了jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果.分享给大家供大家参考.具体如下: 这是一款jquery菜单特效,点击后高亮背景,个性的菜单特效.网上见到比较多的菜单了,不过像这样这么简单的方法来实现却不多见,本菜单整体简洁,点击导航栏上的任意菜单项后,该菜单项的背景变成黑色,并且鼠标移走后,仍然固定保持黑色,记住了菜单的位置. 运行效果如下图所示: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-menu-set-focus-

js实现具有高亮显示效果的多级菜单代码

本文实例讲述了js实现具有高亮显示效果的多级菜单代码.分享给大家供大家参考.具体如下: 这是一款具有高亮效果的菜单,菜单设计的也比较简洁,鼠标放在一级菜单上可以看到二级菜单的高亮效果,整体风格简约大方,适用于一些比较"干净"没有过多修饰的网站. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-blink-show-style-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-/

JS实现选中当前菜单后高亮显示的导航条效果

本文实例讲述了JS实现选中当前菜单后高亮显示的导航条效果.分享给大家供大家参考.具体如下: 这里演示选中当前菜单后,该菜单高亮显示,也就是说在不改变菜单CSS代码的情况下,用JavaScript去控制菜单的背景,如果该菜单项被点击后,将赋予它一个与众不同的背景颜色或背景图像,这样可以清淅的指引用户下在浏览的网站栏目,本菜单不需要动态语言的加入,简单方便而且效果好. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-cho-nav-gl-sho

基于jquery实现导航菜单高亮显示(两种方法)

项目需求: 实现原理:当选中当前元素时,给当前元素添加样式,同级元素移除样式. 点击不同的导航菜单实现当前点击的菜单是高亮的,点击导航下面的某个分类,分类所属的导航也必须是高亮的,点击某一篇文章,文章所属的导航菜单也必须是高亮的. 效果图如下: 示例代码一: 具体示例代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/x

解决yii2左侧菜单子级无法高亮问题的方法

我们先来看看具体问题. 添加角色是属于角色这个菜单的,如何在执行添加角色这个操作时让角色这个菜单处于选中状态呢? adminlte左侧导航的Create,View等action不能定位到index的模块(左侧二级导航不能展开定位) 如果你是按照我们上文的教程来的,那接下来所要说明的问题应该不是问题,先来看看我们当时是怎么处理左侧菜单menu的 use mdm\admin\components\MenuHelper; <?php $callback = function($menu){ //鉴于篇

Yii2 rbac权限控制之菜单menu实例教程

在上篇文章给大家介绍了yii2搭建完美后台并实现rbac权限控制实例教程中完美实现了yii2的后台搭建和rbac权限控制,如果你还没有实现,请先看上文再回来参考本文,因为本文是在上文的基础上进行完善和补充. 部分小伙们纷纷反映,最后菜单menu怎么控制权限呀,看不懂,搞不定,而且你那貌似没搞完,瞎忽悠!确实没那么全,今天看我们如何实现菜单完美权限化.先罗列下主要讲的内容,不需要的没必要看下去,只为分享给有需要的人. 利用menu表添加菜单 左侧菜单结果adminlte完美呈现 菜单前面自定义ic

两种简单实现菜单高亮显示的JS类代码

记得当年写静态页时,为了实现高亮都是在每个页面加不同的样式,呵.高亮显示我觉得对于web前端来说,是比较常用到的效果,正好此次又要用到,特地整理出我所写的两种高亮类. 其实思路很简单,第一种方法是通过遍历链接组的href值,通过indexOf判断href值是否被包含在浏览器当前url值中.此方法有一定局限,比如对于iframe内的菜单是不能这样判断的; 第二种方法适用范围更广一样,实现思路也比较简单,即通过判断点击,给点击项加载高亮样式. 第一种判断当前URL值高亮类代码: 复制代码 代码如下:

JS 动态加载js文件和css文件 同步/异步的两种简单方式

/*动态添加js或css,URL:文件路径,FileType:文件类型(js/css)*/ function AddJsFiles(URL,FileType){ var oHead = document.getElementsByTagName('HEAD').item(0); var addheadfile; if(FileType=="js"){ addheadfile= document.createElement("script"); addheadfile

JavaScript数值千分位格式化的两种简单实现方法

在对数值进行格式化的时候,一个常见的问题是按照千分位格式化,网上对这个问题已经有很多种解决方法了,还可以利用Array.prototype.reduce方法来实现千分位格式化. function formatNumber(num) { if (isNaN(num)) { throw new TypeError("num is not a number"); } var groups = (/([\-\+]?)(\d*)(\.\d+)?/g).exec("" + nu

Java之递归求和的两种简单方法(推荐)

方法一: package com.smbea.demo; public class Student { private int sum = 0; /** * 递归求和 * @param num */ public void sum(int num) { this.sum += num--; if(0 < num){ sum(num); } else { System.out.println("sum = " + sum); } } } 方法二: package com.smbea

两种简单的跨域方法(jsonp、php)

Ajax不能跨域,比如您是www.baidu.com,您就不能请求www.163.com的文件.但您可以请求www.baidu.com/1.json.ent.baidu.com/1.json.这是因为安全原因,对于任何后台语言来说.服务器程序来说,所有的XHR类型的请求,如果来自其他的服务器,将不予应答. 一.使用jsonp JSONP是JSON with Padding的略称.它是一个非官方的协议,出处不可考,它允许在服务器端集成Script tags返回至客户端,通过javascript c

用JQuery实现全选与取消的两种简单方法

用JQUERY实现全选和取消全选,没有js那么繁琐,而且支持更多浏览器. 复制代码 代码如下: <mce:script type="text/javascript"><!-- $(function() {      $("#checkall").click(function() {          $("input[@name='checkname[]']").each(function() {              $(

判断ie的两种简单方法

判断ie,想必大家都会写,但是如何将判断条件变得简单呢,也许大家并不是很清楚,下面一段代码,让大家轻松判断ie. 复制代码 代码如下: var ie = /*@cc_on !@*/false; var ie = !-[1,];

JavaScript判断两种格式的输入日期的正确性的代码

最简单的 复制代码 代码如下: function isValidDate(dateStr) {             var matchArray = dateStr.match(/^[0-9]+-[0-1][0-9]-[0-3][0-9]$/)             if (matchArray == null) {               alert("Invalid date: " + dateStr);               return false;      

两种php给图片加水印的实现代码

PHP最简单的加水印方法 <?php $img = imagecreatefromjpeg($filename); $logo = imagecreatefromjpeg($filename); /*imagecraetefromjpeg-由文件或URL创建一个新图像 imagecreatefromjpeg(string $filename) 如果启用了fopen包装器,URL可以作为文件名*/ imagecopy($img,$logo,15,15,0,0,$width,$height); /*

JS自动倒计时30秒后按钮才可用(两种场景)

展示效果图: WEB开发中经常会用到倒计时来限制用户对表单的操作,比如希望用户在一定时间内看完相关协议信息才允许用户继续下一步操作,又比如在收取手机验证码时允许用户在一定时间过后(未收到验证码的情况下)再次获取验证码.那么今天我来给大家介绍下如何使用Javascript来实现这一简单应用. 查看演示 下载源码 应用场景1:用户注册时阅读完相关协议信息后才能激活按钮 某些网站注册时要求用户同意所谓的用户协议之类的信息,如果协议内容非常重要,有些网站会要求新注册的用户一定要阅读完相关协议信息才能激活