如何通過模態背景使徽標出現

我試圖做一些與模式有點不同的東西，並在任何時候在疊加層上顯示我們的徽標。如何通過模態背景使徽標出現

情況是，當用戶打開模式時，模態出現，但我們的標誌覆蓋在黑色透明部分上。

我試過很多方法，可以看到徽標的z-index不斷被重置，即使我將z-索引硬編碼並將其位置放在模態z-index之上。

我甚至嘗試過使用次要徽標圖像來顯示何時顯示對話框，以便它自己顯示在疊加層上方。但沒有運氣。

有什麼我在這裏失蹤？

在此先感謝

$("[data-toggle=modal").click(function(){ 
// events to occur globally for when a modal is toggled 
    $("#ajax-right-modal-large").on('shown.bs.modal',function(){ 
     $("#logo").addClass('hidden'); 
     $("#logo-modal").removeClass('hidden').attr('style','border:1px solid blue; z-index: 1701 !important;');  
     $(".fade-in").css('z-index','1501'); 
     $("#logo-modal").attr('style',''); 
    }); 
    // end function 
});

來源

2016-07-09 user125264

用樣式發佈您的源代碼 –

$（「[data-toggle ='modal']」）中缺少方括號 –

我可以想象你的位置設置爲您的導航欄，所以你正在試圖定位您的徽標時，父母一方的位置，這就是爲什麼你沒有得到任何結果。這是很難說，因爲我不能看到你的HTML標記看起來像，但我認爲這是問題。所以你可以在這裏做幾件不同的事情。如果您使用的是靜態的導航欄，你可以做可能做這樣的事情：

body.modal-open .navbar-static-top{ 
    position:inherit; 
}

然後你就可以將標誌放置到一個高的z-index，並給它的模式疊加上方的固定位置。

如果您使用的是固定導航欄，那麼您可能不希望這樣做，因爲它會讓您的內容跳來跳去，導航欄將消失在模式疊加層下方，因此您可能只想在您的頂部添加徽標頁面並給它一個display:none，然後在body.modal-open給這個塊的顯示，所以它只在你的模態打開時出現。

或者你可以只添加和刪除標誌埃維時間模式打開使用jQuery像這樣：

$(document).on('shown.bs.modal',function(){ 
    $('body').append('<a class="appended-logo">Appended Logo</a>') 
}); 
$(document).on('hidden.bs.modal',function(){ 
    $('.appended-logo').remove(); 
});

這裏是只是把一個標誌在頁面的頂部顯示狀態的小提琴沒有，也與jQuery附加標誌，所以你可以看到這兩個。

Fiddle Demo

無論如何，我希望這是你在找什麼，並希望它能幫助。

來源

2016-07-09 06:51:25

如何通過模態背景使徽標出現

回答

相關問題