[英]How to show drop-down menu from top to use.show()
I have created a dropdown menu using cssmenumaker. 我使用cssmenumaker创建了一个下拉菜单。 Everything is working fine on the desktop, and also on mobile view. 一切都在桌面上以及移动视图上正常运行。 But, On mobile view, when I am clicking on the dropdown link it's showing from the left. 但是,在移动视图中,当我点击从左侧显示的下拉链接时。 But, I want to show/slide up from the top. 但是,我想从顶部显示/向上滑动。 I am not a jquery expert. 我不是一个jquery专家。 I am using the following code- 我使用以下代码 -
Here is live link live link 这是实时链接实时链接
/*================ Menu ====================*/
(function($) {
$.fn.menumaker = function(options) {
var cssmenu = $(this), settings = $.extend({
title: "Menu",
format: "dropdown",
sticky: false
}, options);
return this.each(function() {
cssmenu.prepend('<div id="menu-button">' + settings.title + '</div>');
$(this).find("#menu-button").on('click', function(){
$(this).toggleClass('menu-opened');
var mainmenu = $(this).next('ul');
if (mainmenu.hasClass('open')) {
mainmenu.hide().removeClass('open');
}
else {
mainmenu.show("slow").addClass('open');
if (settings.format === "dropdown") {
mainmenu.find('ul').show("slow");
}
}
});
cssmenu.find('li ul').parent().addClass('has-sub');
multiTg = function() {
cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
cssmenu.find('.submenu-button').on('click', function() {
$(this).toggleClass('submenu-opened');
if ($(this).siblings('ul').hasClass('open')) {
$(this).siblings('ul').removeClass('open').hide();
}
else {
$(this).siblings('ul').addClass('open').show("slow");
}
});
};
if (settings.format === 'multitoggle') multiTg();
else cssmenu.addClass('dropdown');
if (settings.sticky === true) cssmenu.css('position', 'fixed');
resizeFix = function() {
if ($( window ).width() > 767) {
cssmenu.find('ul').show("slow");
}
if ($(window).width() <= 767) {
cssmenu.find('ul').hide().removeClass('open');
}
};
resizeFix();
return $(window).on('resize', resizeFix);
});
};
})(jQuery);
(function($){
$(document).ready(function(){
$("#cssmenu").menumaker({
title: "",
format: "multitoggle"
});
});
})(jQuery);
Try with slideDown();
尝试使用slideDown();
insteat of show();
show();
insteat show();
使用slideDown()函数而不是show()函数
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.