1 /**
  2  * 下拉菜单
  3  * @constructor
  4  * @author putaoshu@126.com
  5  * @date 2012-03-14
  6  * @param {Object} options 组件配置
  7  * @param {Object} options.menuTop $('#menuTop') 点击元素
  8  * @param {Object} options.menu $('#menu') 菜单主体
  9  * @param {Boolean} options.autoShow false 主体元素有被遮挡时,把主体转移到上面
 10  * @param {Object} options.css 
 11  * @param {Number} options.css.left 菜单left值
 12  * @param {Number} options.css.top 菜单top值
 13  * @requires vui.stick()
 14  */
 15 
 16 vui.menu = function(options) {
 17 	options = $.extend({
 18 		menuTop : $('#menuTop'),//点击元素ID
 19 		menu : $('#menu'),//菜单主体ID
 20 		type : 'click', //click || hover
 21 		autoShow : false,//自适应:即在主体元素有被遮挡时,把主体转移到上面
 22 		css : {
 23 			left:null,
 24 			top:null
 25 		}
 26 	},options); 
 27 
 28 	var o = {		
 29 		init:function(){
 30 			options.menu.appendTo('body');
 31 			if(options.type == 'click'){
 32 				o.clickhide();
 33 				options.menuTop.mouseup(function(){
 34 					if (o.showTag){
 35 						o.close();
 36 					}else{
 37 						o.show();
 38 					}
 39 					return false;
 40 					
 41 				})
 42 			}else if(options.type == 'hover'){
 43 				options.menuTop.click(function(){
 44 					o.show();
 45 				})
 46 				options.menuTop.bind('mouseover',function(){
 47 					o.show();
 48 				})
 49 			}
 50 		},
 51 		showTag:false,
 52 		show:function(){
 53 			
 54 			var $left,$top;
 55 			if (options.css.left != null || options.css.top != null){
 56 				vui.stick({stick:options.menuTop,stickTo:options.menu,autoShow:options.autoShow,css:{type:1,top:options.css.top,left:options.css.left}});
 57 			}else{
 58 				vui.stick({stick:options.menuTop,autoShow:options.autoShow,stickTo:options.menu});
 59 			}
 60 			o.showTag=true;
 61 		},
 62 		close:function(){
 63 			  options.menu.hide();
 64 			  o.showTag=false;
 65 		},
 66 		mouseInsideTag : false,
 67 		clickhide:function(){
 68 			
 69 			options.menu.click(function(){
 70 				o.close();
 71 			})
 72 			
 73 			options.menu.hover(function(){ 
 74 				o.mouseInsideTag=true; 
 75 			}, function(){ 
 76 				o.mouseInsideTag=false; 
 77 			});
 78 
 79 			$("html,body").mouseup(function(){ 
 80 				if(o.mouseInsideTag){
 81 					o.show();
 82 				}else{
 83 					o.close();
 84 				}
 85 			});
 86 		}
 87 	}
 88 
 89 	o.init();
 90 }
 91 
 92