Tag: 菜单

单击Jquery打开和关闭子菜单

我有一个主菜单,它将在jquery中显示带有click事件的子菜单(客户端想要点击而不是hover)所以我让它工作但是我仍然无法找到一件事:我有菜单和子菜单正常工作所以当我点击“新闻”时,子菜单很好地向下滑动,当我点击“新闻”时它会关闭,但是如果在打开新闻’子菜单后我点击“资源”,则会出现相应的子菜单但是新闻’子菜单保持打开状态,我希望在点击其他菜单项或主菜单区域外的任何想法时关闭上一个子菜单? 这是我得到的: Home About Us News sub menu 1 sub menu 2 sub menu 3 sub menu 4 sub menu 5 sub menu 6 Jobs Contact Us Admin Resources sub menu 1 sub menu 2 sub menu 3 sub menu 4 sub menu 5 sub menu 6 New Button 和jquery: $(function(){ $(‘#MainMenu’).find(‘> li’).click(function(){ $(this).find(‘ul’) .stop(true, […]

jQuery更改CSS背景位置和鼠标hover/ mouseout

我有一个由单个图像组成的菜单(例如,精灵)。 为了显示hover图像,我只需将背景图像向下移动。 我希望这个效果由jQuery和动画控制。 这是一个示例菜单项。 这就是我正在玩弄的东西。 我是jQuery的新手,并且在使用正确的选择器时遇到了问题。 $(document).ready(function(){ $(‘#home a’); // Set the ‘normal’ state background position .css( {backgroundPosition: “0 0″} ) // On mouse over, move the background .mouseover(function(){ $(this).stop().animate({backgroundPosition:”(0 -54px)”}, {duration:500}) }) // On mouse out, move the background back .mouseout(function(){ $(this).stop().animate({backgroundPosition:”(0 0)”}, {duration:500}) }) }); 你能指出我做错了什么吗? 我知道选择器可能不正确,但我很难弄清楚如何操纵锚。

FullPage.js – 在非匹配部分添加活动类到菜单锚点

好吧,标题可能有点难以理解,我会尝试解释。 所以我使用的是fullpage.js 我总共有9个部分:首页关于(约有6个“部分”,是关于第一部分的延续)联系方式 在菜单中只有3个导航选项Home,about,contact。 我已经制作了菜单,以便在相应的部分添加活动类 – 就像使用现成的选项一样。 当我滚动并离开第一个关于部分时,活动类将被删除,菜单项不会突出显示。 所以这就是我希望活跃类继续关注所有“缺席”的事情。 因此,菜单项“关于”将突出显示,直到联系人部分。 我认为我可以使用一些“外部”JS,因此根据url,类将被添加到id为“all-about”的锚点: $(document).ready(function () { if (location.href.match(/#about1/ig) || location.href.match(/#about2/ig)){ $(‘#all-about’).addClass(‘active’); } }); 这不起作用。 我会在整个页面中更改JS,或者如何更改我的代码? 谢谢!

点击清除CSS菜单hover状态(通过ajax加载的页面)

我在网站上有一个CSS下拉菜单。 在顶部有一个父类别列表,当您将鼠标hover在一个类别上时,会出现一个下拉菜单,您可以在其中单击其中一个子类别。 单击子类别时,将触发ajax页面加载并替换页面内容。 效果很好。 但问题是,因为页面没有重新加载,下拉菜单仍然存在。 你必须将鼠标移开才能让它消失。 这很烦人。 当您点击子类别时,我们希望菜单消失。 在触摸设备上,这种行为更令人讨厌。 我不会在这里发布代码,而是会链接到网站: http : //tinyurl.com/blvtlwz有问题的菜单是顶部的 – “竞赛马”’休闲马’等。 我会对检测到点击时如何清除hover状态的任何想法感兴趣,或者更好的处理菜单的方法? 我用jquery removeClass()摆弄了,但我运气不好。 谢谢

在JQuery ui菜单中滚动子菜单

以下问题说明了如何在JQuery-ui菜单中使用垂直滚动条: JQuery UI Menu Scroll 这很好,但似乎这样做不适合子菜单。 子菜单有时会在其父级底部创建一个水平滚动条而不是向右延伸。 最终,我希望主菜单和我的子菜单都能正确滚动,而不是任何horrizontal滚动条。 你可以在这个小提琴中看到: http : //jsfiddle.net/kPVKL/菜单“两个”将打开正常,但菜单“三”只显示一个horrizontal滚动条。 我怀疑我的问题在这里: .ui-menu { width: 150px; height: 200px; overflow-y: scroll; } 我哪里做错了? 有更好的方法吗? 我唯一的限制是我必须使用jquery-ui菜单,其他任何东西。 提前致谢。

Jquery中的Google帐户DropDown

是否有任何jQuery或Javascript解决方案用于创建类似于Google用于其用户帐户的菜单? 下面是我正在谈论的图像。 如果您登录Google,则可以在右上角看到下拉列表的演示。

Weebly的自动生成的侧面菜单,可能使用JavaScript或jQuery

有没有人开发过一种方法来自动生成Weebly网站的左侧菜单,可能是通过JavaScript或jQuery? 我并不关心移动下拉菜单,而是更喜欢侧边菜单。 在Weebly论坛网站上,有一个关于如何手动创建每个人的说明,但是每次添加页面时都需要更新它。

均匀间隔和对齐的水平列表菜单

我搜索并找不到为列表样式菜单分隔出一系列lis的解决方案。 我意识到单靠CSS无法做到这一点所以我添加了一些javascript(jQuery)。 我不希望每个LI的宽度相同,我甚至想要填充没有剩余的空间。 如果有人可以采取这个概念并简化我糟糕的javascript或提供替代品,请这样做。 请参见此处的示例: http : //www.valweb.com/menuTest/

使用jQuery将所选属性添加到选择菜单中的选项

我正在制作一个选择菜单插件来替换丑陋的默认选择,并在不同的操作系统中保持一致。 这是演示(只有firefox和webkit) http://spacirdesigns.com/selectMenu/ 它已经工作了,但是我在选择“selected”属性时遇到了问题。 该代码适用于任何其他属性,但我无法使用所选属性。 这有效: select.find(‘option’) .removeAttr(‘whatever’) .eq(index).attr(‘whatever’, ‘hello’); 这不是: select.find(‘option’) .removeAttr(‘selected’) .eq(index).attr(‘selected’, ‘selected’); 这是迄今为止的代码: (function($){ $.fn.selectMenu = function() { var select = this; select.hide(); var title = select.attr(‘title’); var arrow = ‘img/arrow.png’; var items = ”; select .children(‘option’) .each(function(){ var item = $(this).text(); if ($(this).val() != ”) { $(this).attr(‘value’, item); } items += […]

使用Jquery的多级下拉菜单

我想用jQuery设计一个多级菜单。 我已经写了一些代码。你可以在这里看到演示。 这一切都很好。 但我想动态制作多级下拉菜单。 脚本 $(‘ul#menu > li’).hover(function(){ //$(‘#drop’ , this).css(‘display’,’block’); $(‘.drop’ , this).delay(20).slideDown(200); }, function(){ $(‘.drop’ , this).delay(20).slideUp(200); });​ HTML Home About us About us About us About us about Home Home Home Home ​ CSS ul#menu { margin:0; padding:0; } ul#menu > li { list-style:none; float:left; margin:0; padding:0; position:relative; } ul#menu a { […]