这是我的代码。如何点击“#projects”时,如何才能弹出此菜单?将.click功能更改为什么?
$(document).ready(function($) {
$。fn.longDropdown = function(options){ var opts = $ .extend({},$ .fn.longDropdown.defaults,options);
// Weird bug to show the correct number of items
opts.visible = (opts.visible + 1);
return this.each(function() {
// Add down arrow only to menu items with submenus
// $(".dropdown > li:has('ul')").each(function() {
// $(this).find("a:first").append("<img src='images/down-arrow.png' />");
// });
$(".dropdown > li").click(function() {
var $container = $(this),
$list = $container.find('ul'),
$anchor = $container.find('a'),
height = $list.height() * 1.0,
totalHeight = $container.height() * opts.visible,
containerOffset = $container.offset().top + $container.height(),
windowHeight = $(window).height(),
maxHeight = windowHeight - containerOffset;
if( totalHeight > maxHeight ) {
while( $container.height() * opts.visible > maxHeight ) {
opts.visible = (opts.visible - 1);
}
totalHeight = $container.height() * (opts.visible + 1);
}
var multiplier = height / totalHeight;
// need to save height here so it can revert on mouseout
$container.data("origHeight", $container.height());
// so it can retain it's rollover color all the while the dropdown is open
$anchor.addClass("hover");
// make sure dropdown appears directly below parent list item
$list
.show()
.css({
paddingTop: $container.data("origHeight")
});
// don't do any animation if list shorter than max
if (multiplier > 1) {
$container
.css({
height: totalHeight,
overflow: "hidden"
})
.mousemove(function(e) {
var offset = $container.offset();
var relativeY = ((e.pageY - offset.top) * (multiplier)) - ($container.data("origHeight") * multiplier);
if (relativeY > $container.data("origHeight")) {
$list.css("top", -relativeY + $container.data("origHeight"));
};
});
}
}, function() {
var $el = $(this);
// put things back to normal
$el
.height($(this).data("origHeight"))
.find("ul")
.css({ top: 0 })
.hide()
.end()
.find("a")
.removeClass("hover");
opts.visible = (opts.visible + 1);
})
.filter(':has(ul)')
.each(function() {
$(this).find("a:first").append("<img src='" + opts.image + "' />");
});
});
};
//默认选项 $ .fn.longDropdown.defaults = { 可见:4, 图片:'images / down-arrow.png' };
})(jQuery的);
谢谢。
答案 0 :(得分:1)
也许您可以在$(".dropdown > li").click()
中使用匿名函数并命名,然后在文档加载时调用它?像这样:
1)给函数命名:
function expandMenu($container) {
if (typeof $container=='undefined') $container= $(this);
$list = $container.find('ul'),
$anchor = $container.find('a'),
. . . .
Rest of the function body
. . . .
}
2)将函数绑定到文档加载上单击和触发的元素:
$(".dropdown > li").click(expandMenu);
AND
$(document).ready(function() {
expandMenu($('#id_of_auto_expand_menu'));
});
像这样的东西应该可行 - 也就是说,重构函数。
答案 1 :(得分:0)
这应该可以解决问题:$('('#project')。click());