jQuery Bubble Popup v 2.3.1问题

问题描述

| 我正在使用jQuery Bubble Popup v 2.3.1 http://www.vegabit.com/jquery_bubble_popup_v2/ 在两个具有可选true的相邻元素上使用此元素时遇到问题。 当我将鼠标悬停在一个上并将鼠标移到气泡上时；如果鼠标到达气泡后面的另一个元素，则第二个气泡出现在第一个气泡上方。表示一次显示两个气泡。 我希望气泡仅在可见时显示（不在显示气泡的背面），并且我一次也将鼠标悬停在一个气泡上。 请帮忙！

解决方法

我也遇到过为相邻元素显示另一个弹出窗口的问题。下面是我自己管理鼠标事件的代码。希望该脚本能对您有所帮助。

<script type=\"text/javascript\">
    jQuery(document).ready(function() { 
            var MouseOverOnBubble = false;          
            jQuery(\'.ClassName\').CreateBubblePopup({                                
                themeName: \'all-azure\',themePath: \'jquerybubblepopup-theme\',manageMouseEvents: false
              });           
              jQuery(\'.ClassName\').mouseover(function(){                        
                        var button = jQuery(this);
                        var info = \"something\";
                        var generatedId = button.GetBubblePopupID();
                        if(!button.IsBubblePopupOpen())
                        {               
                            jQuery.get(\'getData.php?data=\'+info,function(data) {
                                var seconds_to_wait = 1;
                                function pause(){
                                    var timer = setTimeout(function(){
                                        seconds_to_wait--;
                                        if(seconds_to_wait > 0){
                                            pause();
                                        }else{
                                            button.SetBubblePopupInnerHtml(data,true); //false -> it shows new innerHtml but doesn\'t save it,then the script is forced to load everytime the innerHtml...                                             
                                            button.ShowBubblePopup();//Its freezes bubble until .UnfreezeBubblePopup(),.ShowBubblePopup() or .HideBubblePopup() are called.                             
                                            jQuery(\'#\'+generatedId).mouseover(function(){MouseOverOnBubble = true;jQuery(\'#\'+generatedId).css(\'display\',\'block\');});    
                                            jQuery(\'#\'+generatedId).mouseout(function(){MouseOverOnBubble = false;jQuery(\'#\'+generatedId).css(\'display\',\'none\');});
                                        };
                                    },1000);
                                };pause();                          
                            }); 
                        }
                        else
                        {
                            jQuery(\'#\'+generatedId).css(\'display\',\'block\');
                        }

                }); //end mouseover event   
            jQuery(\'.ClassName\').mouseout(function(){
                var button = jQuery(this);                              
                var seconds_to_wait = 1;
                function pause(){
                    var timer = setTimeout(function(){
                        seconds_to_wait--;                  
                        if(seconds_to_wait > 0){
                            pause();
                        }else{
                            if(!MouseOverOnBubble){button.HideBubblePopup();}
                        };
                    },1000);
                };pause();              
            });
    });
</script>

您也可以尝试使用$ .ajax生成ajax请求，从该位置可以设置beforeSend来设置气泡弹出窗口的预加载图像。