实例 （用到：相关元素 e.target） 仿人人网 鼠标悬浮到某一头像上 出现个人信息摘要 卡片形式 鼠标离开 卡片消失

实例 （用到：相关元素 e.target） 仿人人网 鼠标悬浮到某一头像上  出现个人信息摘要 卡片形式 鼠标离开  卡片消失 

这里的具体效果来自于 u2top.cn  登录之后  右侧的企业信息列表 悬浮可看到效果
function bindShowCompanyCardUI (interestingCompanyList){
            $(interestingCompanyList).delegate('.interesting-company-item', 'mouseenter', function(e){

                $('#company_card_box').remove();
                var interestingCompanyNode = $(this);
                var data = interestingCompanyNode.data('company-id');
                showCompanyCard(interestingCompanyNode,data,e);

            });
            $(interestingCompanyList).delegate('.interesting-company-item', 'mouseleave', function(e){
                hideCompanyCard(e);
            });
        }
        function hideCompanyCard (e){
            $.log(e.relatedTarget);
            if($('#company_card_box').has(e.relatedTarget).length === 0){
                $('#company_card_box').remove();
            }
        }
        function showCompanyCard (companyNode,data,e){

            var companyCardTemplate = '<div id="company_card_box">'+
                                          '<div class="card-bg"></div>'+
                                          '<div class="arrow-top"></div>'+
                                          '<div class="arrow-bottom"></div>'+                                               '<div class="company-card-box-inner">'+           
                                          '<img class="loading" src="http://static.lesongapp.cn/images/recruit/loading-bec10daf6253f52d863aea0b652f85d1.gif" />'+
                                          '</div>'+
                                     '</div>';
            var companyCardBoxNode = $(companyCardTemplate);
            $('body').append(companyCardBoxNode);
            $.pngfix('#company_card_box .arrow-top, #company_card_box .arrow-bottom');
            var width = companyNode.width();
            var height = companyNode.height();
            var x = companyNode.offset().left;
            var y = companyNode.offset().top+height;
            companyCardBoxNode.css({'top':y+'px','left':x+'px'});
            $.get(ZT.uri('company_info_api'),
                  {
                      company_id:data
                  },
                  function(sResult) {
                      
                      var companyInfoTemplate = '<div class="card-main">'+
                                                '<div class="card-content-left">'+
                                                  '<a class="company-img-box" href="{url}"><img class="company-img" src="{image}"></a>'+
                                                  '<a class="follow" href="#"></a>'+
                                              '</div>'+
                                              '<div class="card-content-right">'+
                                                   '<a class="company-name" href="{url}">{name}</a>'+
                                                   '<div class="company-overview">{overview}</div>'+
                                              '</div>'+
                                              '<div class="clear"></div>'+
                                              '</div>';
                      var node = $($.substitute(companyInfoTemplate, {name:sResult.company_info.name,
                                                                      overview:sResult.company_info.overview,
                                                                      image:sResult.company_info.image,
                                                                      url:sResult.company_info.url})); 
                      $.log(sResult.company_info.followed);
                      if(!sResult.company_info.followed){
                          node.find('.follow').text('鍏虫敞');
                      }else{
                          node.find('.follow').text('宸插叧娉�');
                      }

                      node.find('.follow').click(function(e){
                          e.preventDefault();
                          var that = $(this);
                          if(that.text() != '鍏虫敞'){
                              return;
                          }
                          that.text('鍏虫敞涓�...');
                          $.post(ZT.uri('company_follow_api'),
                                 {
                                     company_id:data,
                                     crumb:ZT.crumb
                                 },
                                 function(response) {
                                     $.log(response);
                                     that.text('宸插叧娉�');

                                 });
                      });
                      companyCardBoxNode.find('.loading').hide();
                      companyCardBoxNode.find('.company-card-box-inner').append(node);
                      companyCardBoxNode.mouseleave(function(){
                          $(this).remove();
                      });
                      
                  });
        }