jquery navigation is an essential module for a website. When a user browses a website and views the website navigation bar for a certain purpose, highlighting the effect of the navigation bar is the top priority. Therefore, an effect must be used: jquery mask layer. Use light and dark effects to highlight the current user's actions.
$(function() {
var $oe_menu= $('#oe_menu');
var $oe_menu_items= $oe_menu.children
('li');
var $oe_overlay= $('#oe_overlay');
$oe_menu_items.bind('mouseenter',function(){
var $this = $(this);
$this.addClass('slided selected');
$this.children('div' ).css('z-
index','9999').stop(true,true).slideDown(200,function(){
$oe_menu_items.not
('.slided'). children('div').hide();
$this.removeClass('slided');
});
}).bind('mouseleave',function(){
var $this = $(this);
$this.removeClass('selected').children
('div').css('z-index','1');
});
$oe_menu.bind('mouseenter',function(){
var $this = $(this);
$oe_overlay.stop(true,true).fadeTo(200,
0.6) ;
$this.addClass('hovered');
}).bind('mouseleave',function(){
var $this = $(this);
$this.removeClass( 'hovered');
$oe_overlay.stop(true,true).fadeTo(200,
0);
$oe_menu_items.children('div').hide();
})
});
Statement:The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn