用jquery的hover事件，当鼠标移动到menu时，把遮挡下拉菜单的div设置为负值，鼠标离开时恢复正值， 代码如下： 代码如下:$("#menu").hover( function() { $(".divName").css("z-index", "-1"); }, function() { $(".divName").css("z-index", "0"); });
本例子使用json数据,拼接ul和li来实现的效果图：1.准备json数据: 代码如下:var menuData = [ {id:0,pid:-1,name:"订购产品",url:"",children:[ {id:1,pid:0,name:"电脑配件",url:"http://www.gxlcms.com",children:[ {id:20,pid:1,name:"cpu",url:"http://www.gxlcms.com",children:[ {id:30,pid:20,name:"Intel",url:"http://www.gxlcms.com",children:[ ...
代码如下: contentType="text/html;charset=utf-8" %> WebForm5 /* Root = Horizontal, Secondary = Vertical */ ul#navmenu-h { margin: 0; border: 0 none; padding: 0; width: 500px; /*For KHTML*/ list-style: none; height: 24px; } ul#navmenu-h li { margin: 0; border: 0 none; padding: 0; float: left; /*For Gecko*/ display: inline; list-style: none; position: relative; height: 24px; } ul#navmenu-h ul { mar...
利用struts2和Ajax实现json对象的传输，然后实现菜单的二级联动 下面是我的 js文件原码： 代码如下: var mail={ //初始化 init:{ //初始化数据 initdata:{ did:, ttitle:, sendpassword:, description: }, //初始化事件 initevent:{ DataEvent:function(){ $("#did").unbind("change");//获取一级菜单，绑定事件 $("#did").bind("change",function(){ //alert($(this).val()); mail.init.initdata.did=$(this).val(); //alert(mai...
用jquery实现的一个超级简单的下拉菜单。 效果图 初始效果 鼠标悬浮效果 代码 代码如下: nav a { text-decoration: none; } nav > ul > li { float: left; text-align: center; padding: 0 0.5em; } nav li ul.sub-menu { display: none; padding-left: 0 !important; } .sub-menu li { color: white; } .sub-menu li:hover { background-color: black; } .sub-menu li:hover a { color: white; } ul { list-style: none; ...
代码如下: Menu #nav { list-style: none; text-align: center; } #nav li { float: left; width: 100px; color: white; background-color: #3E3E3E; } #menu { list-style: none; padding: 5px; display: none; margin-left: -5px; margin-top: -5px; } #menu li { background-color: #ccc; width: 100px; text-align: left; padding-left: 10px; } #menu li a:link { text-decoration: none; display: block; } #menu li a:...
JQuery获取和设置Select选项 获取Select ： 获取select 选中的 text : $(“#ddlRegType”).find(“option:selected”).text(); 获取select选中的 value: $(“#ddlRegType “).val(); 获取select选中的索引: $(“#ddlRegType “).get(0).selectedIndex; 设置select: 设置select 选中的索引： $(“#ddlRegType “).get(0).selectedIndex=index;//index为索引值 设置select 选中的value：$(“#ddlRegType “).attr(“value”,”Normal...
这个下拉菜单式可以循环的使用jquery实现，很实用，喜欢的朋友可以参考下
首先声明： 本人虽然在web前端岗位干了好多年，但无奈岗位对技术要求不高。html,css用的比较多，JavaScript自己原创的很少，基本都是copy修改，所以自己真正动手写时，发现基础很不牢固，边学习边实践，收获很大。 效果图：不废话了，贴码了 1、css代码代码如下: a:link{color:white;text-decoration:none;} a:visited{color:white;text-decorative:none;} a:hover{color:white;text-decorative:none;} a:active{color:white;te...
Jquery 是一个轻量的框架，个人认为非常好用，今天就写一个非常简单的例子，实现下拉菜单功能； 首先肯定要在页面引用jquery.js 版本不限 ； 接下来把=====================html贴出来：代码如下:系统管理 干管所勤 保护站 木材检验 森林管护 <div class=”display movediv” id=”slgh_menu_div”> 出勤管理 巡视管理 现场取证 问题处置 位置监测 检验管理
本文实例讲述了js使用DOM设置单选按钮、复选框及下拉菜单的方法。分享给大家供大家参考。具体实现方法如下： 1.设置单选按钮 单选按钮在表单中即它是一组供用户选择的对象，但每次只能选一个。每一个都有checked属性，当一项选择为ture时，其它的都变为false. 先贴上一个例子：代码如下:function getChoice() {var oForm = document.forms["uForm1"];var aChoices = oForm.camera;for (i = 0; i if (aChoices[i].checked) //如果发...
本文实例讲述了javascript实现多级联动下拉菜单的方法。分享给大家供大家参考。具体实现方法如下：代码如下:var arrItems1 = new Array(); var arrItemsGrp1 = new Array(); arrItems1[3] = "列二"; arrItemsGrp1[3] = 1; arrItems1[4] = "列二三"; arrItemsGrp1[4] = 1; arrItems1[5] = "列二四"; arrItemsGrp1[5] = 1; arrItems1[6] = "列三"; arrItemsGrp1[6] = 2; arrItems1[7] = "列三一"; arrItemsGrp1[7] = 2; arrItems1[0]...
本文实例讲述了jQuery实现渐变下拉菜单的简单方法。分享给大家供大家参考。具体实现方法如下：代码如下:$(function(){$("#nav li").hover(function(){if(!$(this).children("#nav li ul").is(":animated")){$(this).children("#nav li ul").fadeIn("100");}},function(){$(this).children("#nav li ul").fadeOut("400");});//willin})#nav li {float:left; line-height:2em; margin:5px 0 5px 5px;} #nav li ul {position:absolute...
这是一款精美的多级下拉菜单美化,可以完美替代“select”来实现下拉菜单的效果。而且支持多级菜单，有加载等待效果，有层级分类展示。代码如下:Filament Group Labbody { font-size:62.5%; margin:0; padding:0; } #menuLog { font-size:1.4em; margin:20px; } .hidden { position:absolute; top:0; left:-9999px; width:1px; height:1px; overflow:hidden; } .fg-button { clear:left; margin:0 4px 40px 450px; padding: .4em 1e...
html代码脚本之家特效 教程 资源 模板 资讯js代码// 【经典】弹出层菜单 $(document).ready(function(){ var objStr = ".UpLayer"; $(objStr).each(function(i){ $(this).click(function(){ $($(objStr+" dd")[i]).show(); $($(objStr+" dt")[i]).addClass("UpLayer02"); }); $(this).hover(function(){},function(){ $($(objStr+" dd")[i]).hide(); $($(objStr+" dt")[i]).removeClass("UpLayer02"); }); }); }); css代码body,...