0

当您将鼠标悬停在列表中的某个项目上时，我正在使用 Superfish 弹出工具提示，这很有效，但是当鼠标悬停在基础列表项上时，弹出 div 允许其下方的其他项目触发弹出窗口。

换句话说，虽然弹出窗口看起来不透明，但它不像不透明的 div，因为它允许它下面的项目在弹出窗口消失之前仍然触发事件。

我将 z-index 设置为 9999 以确保 div 的位置高于其他所有内容，但它不像实心/不透明 div。

我错过了什么？设置不透明度是否会影响视觉不透明度？

这是在鼠标悬停时调用气泡弹出窗口的 jQuery 函数：

function Popup(){

    //create a bubble popup for each DOM element with class attribute as "text", "button" or "link" and LI, P, IMG elements.
    $('.text, .button, .link').CreateBubblePopup({
        selectable: true,
        position : 'top',
        align    : 'center',
        innerHtml: '<img src="/images/loading.gif" alt="Loading" style="border:0px; vertical-align:middle; margin-right:10px; display:inline-block;" /><span>loading!</span>',
        innerHtmlStyle: {
                            //color:'#FFFFFF', 
                            'text-align':'left',
                            'z-index':'9999',
                            'width':'500px'
                        },                          
        themeName:  'blue', //'all-black',
        themePath:  '/jquerybubblepopup-theme'
    });

    // add a mouseover event for the "link" element...
    $('.link').mouseover(function(){

            //get a reference object for "this" target element
            var link = $(this);

            //load data asynchronously when mouse is over...
            $.ajax({
                    url: '/bodytext.php?id=' + this.id,
                    type: 'GET',
                    cache: false,
                    success: function(data) {
                        var seconds_to_wait = 0;
                        function pause(){
                            var timer = setTimeout(function(){
                                seconds_to_wait--;
                                if(seconds_to_wait > 0){
                                    pause();
                                }else{

                                    //set new innerHtml for the Bubble Popup
                                    link.SetBubblePopupInnerHtml(data, false); //false -> it shows new innerHtml but doesn't save it, then the script is forced to load everytime the innerHtml... 

                                    // take a look in documentation for SetBubblePopupInnerHtml() method
                                    //$('.link').SetBubblePopupOptions(selectable, true);

                                };
                            },500);
                        };pause();
                    }
                });

    }); //end mouseover event

}

4

0 回答 0