jquery实现左右滑动菜单效果代码_jquery

(function(a){
 a.fn.webwidget_menu_glide=function(p){
 var p=p||{};
 var f=p&&p.menu_text_size?p.menu_text_size:"12px";
 var g=p&&p.menu_text_color?p.menu_text_color:"blue";
 var h=p&&p.menu_margin?p.menu_margin:"10px";
 var i=p&&p.menu_width?p.menu_width:"100px";
 var j=p&&p.menu_height?p.menu_height:"20px";
 var k=p&&p.menu_sprite_color?p.menu_sprite_color:"red";
 var l=p&&p.menu_background_color?p.menu_background_color:"black";
 var m=p&&p.sprite_speed?p.sprite_speed:"fast";
 f += "px";
 h += "px";
 i += "px";
 j += "px";
 var n=a(this);
 if(n.children("ul").length==0||n.find("li").length==0){
 n.append("Require menu content");
 return null
 }
 s_m(n.children("ul").children("li"),h,i,j);
 s_m_t_c(n.find("a"),g,j,f);
 n.css("background-color",l);
 if(n.children("ul").children("li").is(".current")){
 var o=n.children("ul").children("li").filter(".current").offset()
 }else{
 var o=n.children("ul").children("li:first").offset()
 }
 var q=o.left+'px';
 s_m_s_c(n.find(".webwidget_menu_glide_sprite"),k,i,j,q);
 n.children("ul").children("li").hover(function(){
 var b=$(this).offset();
 var c=b.left+'px';
 n.find(".webwidget_menu_glide_sprite").stop().animate({
 left:c
 },m)
 },function(){
 n.find(".webwidget_menu_glide_sprite").stop().animate({
 left:q
 },m)
 });
 n.children("ul").children("li").children("ul").children("li").hover(function(){},function(){});
 function s_m_t_c(a,b,c,d){
 a.css("color",b);
 a.css("line-height",c);
 a.css("font-size",d)
 }
 function s_m(a,b,c,d){
 style="margin-right:"+b+"; width: "+c+"; height: "+d+";";
 a.attr("style",style)
 }
 function s_m_s_c(a,b,c,d,e){
 a.css("background-color",b);
 a.css("width",c);
 a.css("height",d);
 a.css("left",e)
 }
 }
})(jQuery);




 

 
Demo1
 

 

 
 $(function() {
 $("#webwidget_menu_glide1").webwidget_menu_glide({menu_width:"100", menu_height:"30", menu_text_size:"15", menu_text_color:"#FFF", menu_sprite_color:"red", menu_background_color:"#C91A3E", menu_margin:"5", sprite_speed:"normal", container:"webwidget_menu_glide1" });
 });
 
 
 
 
 
Home
 
News
 
About
 
Contact
 
More...
 
 
 
 
 

 
Demo2
 

 

 
 $(function() {
 $("#webwidget_menu_glide2").webwidget_menu_glide({menu_width:"100", menu_height:"30", menu_text_size:"15", menu_text_color:"#CCC", menu_sprite_color:"#666", menu_background_color:"#000", menu_margin:"5", sprite_speed:"normal", container:"webwidget_menu_glide2" });
 });
 
 
 
 
 
Home
 
News
 
About
 
Contact
 
More...
 
 
 
 
 

 
Demo3
 

 

 

希望本文所述对大家的jquery程序设计有所帮助。 




    

    

    

        
jquery实现左右滑动菜单效果代码_jquery
        
jquery实现左右滑动菜单效果代码_jquery:本文实例讲述了jquery实现左右滑动菜单效果代码。分享给大家供大家参考。具体如下： 这里演示了三种背景颜色左右滑动jquery菜单导航效果，IE下有问题，本菜单使用了CSS3的部分属性，因此建议使用火狐或Chrome等浏览器获取最佳效果。当把鼠标移到菜单上的时候
        
推荐度：

    
    

        
            点击下载本文
            文档为doc格式
        
    

              
        
                

            标签：
                        菜单
                        特效
                        代码
                    
                
            
            
 
                    

                        
热门焦点
                    
                    

                        

                            
                            
                            
                        
                        
                    
            
            
        
        
        
        

            
            

                
最新推荐
                

                    
                
                
                
            
            
            
            
            

                
猜你喜欢
                

                    
                    
                   
                    
                
            
           
            
            
           
            

                
热门推荐
                

                    
                    
                
            
           
            
        
        
        
专题

    















    



    

        
 
            产品服务
            发展历程
            企业资讯
            企业文化
            关于我们
            加入我们
            联系我们
            网站导航
            网站律师
        
        

            

                 
                     
             
             

                 
                     
             
             

                 
                     
             
             

                 
                     
             
             

                 
                     
中国扫黄打非网
                 
             
        
        
 
            
            
Copyright © 2019-2025 51dongshi.net 版权所有
            

                赣ICP备2023002352号-34
            
            
违法及侵权请联系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市万商天勤律师事务所王兴未律师提供法律服务
            
        
    




Top