我是jQuery的新手,想要将hoverintent插件添加到我的网站作为我的导航菜单.我被提到Brian Cherne的网站并看到要下载的代码,但我不太确定如何将它们放在一起以使其工作.有人可以使用添加的相应hoverintent插件代码发布html代码应该是什么样子吗？或者参考我的参考？我非常感激!谢谢!
我正在使用jQuery hoverIntent.js脚本来创建一个巨大的下拉菜单系统,该系统的灵感来自Son Tonaka的大型下拉/ CSS和jQuery sohtanaka.com/web-design/mega-drop-downs-w-css-jquery.我的页面包含一个由第三方供应商插入的prototype.js脚本(这是一个加载属性搜索和潜在客户管理内容的房地产网站).它在标签之前加载到最后.我的菜单脚本和jQuery调用加载在标记的顶部.下面我已经包含了2个链接.第一个链接我已经注释掉对prototype.js的调用,菜单工作正常.第二个链接调用prototype.js,下拉列表不起作用.
工作下拉:http://www.myreoforeclosures.com/_menutestfromcode.html(prototype.js已注释掉)
不工作下拉:http://www.myreoforeclosures.com/_menutestfromcode2.html(与prototype.js一起工作)
我已经尝试了jQuery网站上建议的jQuery noConflict()解决方案的许多变体,但对于我的生活,我无法解决冲突.我已经将上述链接简化为CSS和HTML的基础知识来测试下拉列表.
请注意我正在使用Web 2.0/CSS/jQuery攀登陡峭的学习曲线,因为这是我第一次尝试使用这些工具设计网站(以前基于表格的网站).
任何有助于让jQuery和原型协同工作的帮助将不胜感激.我只能控制jQuery脚本,因此必须对jQuery进行任何解析.我对prototype.js没有任何控制权.
我有一个菜单栏,在上排显示一组类别.
其中一个类别有一组子类别.
我有一个hoverIntent设置,以便它将slideDown子菜单,并在鼠标离开时slideUp.
但是,如果我正在查看此类别中的页面,我希望子菜单在突出显示活动类别时可见.我还想确保当子菜单通过鼠标进行交互时,一旦鼠标离开,它就不会再次滑动.
我已尝试在此页面中的元素上重新声明hoverIntent函数但它不起作用,它仍然使用以前的绑定.有没有办法取消绑定以前的hoverIntent并确保它使用新的？
我在删除Superfish下拉修复的初始延迟时遇到了问题.我的客户希望延迟退出,但不要拖延.
我有一个纯CSS下拉菜单(与Twentyten下拉菜单相同),我正在应用Suckerfish.js.
这是我的代码:
$('ul#menu-airco-mb-navigatiestructuur').superfish({
delay: 600,
autoArrows: false,
speed: 'fast'
});
我一直在阅读Superfish手册,但我似乎无法找到触发初始延迟的原因.也许它与动画有关animation: {opacity:'show'}(我似乎无法理解这一点).
非常感谢!
我有一个元素:
<span ng-mouseenter="showIt()" ng-mouseleave="hideIt()">Hover Me</span>
<div class="outerDiv" ng-show="hovering">
<p>Some content</p>
<div class="innerDiv">
<p>More Content</p>
</div>
</div>
这是JS:
// mouseenter event
$scope.showIt = function () {
$scope.hovering = true;
};
// mouseleave event
$scope.hideIt = function () {
$scope.hovering = false;
};
我希望能够在悬停事件上设置500毫秒的延迟.
我已经对这个问题有了答案,但我再也不能发布8个小时了.我会回来的!
var config = {
sensitivity: 3,
interval: 5000,
timeout: 5000,
};
$("#cart-summary").hoverIntent(function () {
$('.flycart').slideDown('fast');
}, function() {
$('.flycart').slideUp('fast');
}).find('a.close').click(function(){
$(this).parents('.flycart').hide();
});
......这有效,但有两个问题:
它似乎不会像它应该等待5秒,无论我设置什么,几乎立即打开.
在同一页面上使用hoverintent插件影响所有元素.
我真的很感激任何帮助.谢谢!
后面的代码用于显示和隐藏Mega Dropdown.如果你鼠标悬停在'dropDown'类的链接上,那么它的子节点'.dropPanel'会显示.只要您的鼠标位于链接或下拉面板上,就会显示下拉面板.将光标移动到链接或面板的任何位置,并隐藏面板.很基本的东西.
在其中一些Mega Dropdown中,有些表格包含选择元素.在Firefox中,一切都很好.在IE中(具体来说,8没有测试过任何其他版本),如果你鼠标悬停在下拉面板中的select元素上,hoverIntent将触发dropPanelOff()的'out'函数,并且下拉面板会隐藏.
我该如何防止这种情况？
// Apply Hover Intent to Menu Panels
$(".dropDown").hoverIntent({
sensitivity: 10,
interval: 150,
over: dropPanelOn,
timeout: 150,
out: dropPanelOff
});
// Menu Over function call
function dropPanelOn() {
$('a[rel="dropLink"]', this).addClass('hover');
$('.dropPanel', this).slideDown('fast');
}
// Menu Out function call
function dropPanelOff() {
obj = this;
$('.dropPanel', this).slideUp(100, function(){
$('a[rel="dropLink"]', obj).removeClass('hover');
$('.dropLink span', obj).removeClass('hover');
});
}
首先,我道歉...我之前已经发布过这个问题,但我解释不好.我在将hoverIntent插入以下JavaScript时遇到问题...我需要它来替换下面的mouseenter和mouseleave函数.为了清楚起见,我正在寻求帮助,因为我对JavaScript语法不是很了解.下面的第二个代码片段似乎应该可以工作,但它什么都不做,似乎在Internet Explorer中完全死了.
if (jQuery.browser.msie === true) {
jQuery('#top_mailing')
.bind("mouseenter",function(){
$("#top_mailing_hidden").stop().slideDown('slow');
})
.bind("mouseleave",function(){
$("#top_mailing_hidden").stop().slideUp('slow');
});
}
我将以下内容用于其他浏览器,但它在Internet Explorer中无法正常运行.
$('#top_mailing').hoverIntent(
function () {
$("#top_mailing_hidden").stop().slideDown('slow');
},
function () {
$("#top_mailing_hidden").stop().slideUp('slow');
}
);
我正在使用jquery的cluetip来显示,呵呵,工具提示:-)我让它们变得粘稠,因为我希望用户能够将鼠标移动到显示的工具提示 - 如果他们愿意的话.但是,如果用户没有将鼠标移动到工具提示,我希望工具提示在一段时间后消失.在我看来,这应该可以使用hoverintent-plugin.但是,除非用户将鼠标移到插件上一次,否则此插件不会触发.如果发生这种情况,cluetip会自动删除工具提示......
如何显示工具提示,等待500毫秒,如果用户没有鼠标悬停工具提示,则消失？
我一直在考虑使用onShow触发计时器,在工具提示中添加一个脚本,onmouseover禁用计时器和类似的东西,但这看起来过于复杂......
有人有更好的主意吗？:-)
谢谢,
保罗
我正在尝试将hoverIntent插件添加到我页面上的元素中,但是稍后会将一些元素添加到DOM中,这意味着我必须将插件绑定到将来的元素.你是怎样做的？我已经在SO上看过几次同样的问题了,但是没有人有明确的解决方案吗？