2010-08-17 67 views
1

我使用了兩個不同的jQuery插件,我試圖將它們結合起來。首先,我使用http://fancybox.net/home的彈出式插件。彈出窗口顯示時,我需要在彈出窗口中有一個帶有日期選擇器的文本框。 datepicker來自jQuery UI。問題是日期選擇器總是顯示在彈出框後面,所以不可能選擇日期。這是我能以某種方式改變的嗎?jQuery datepicker出現在彈出框後面

我的代碼:

<html> 
    <a id="inline" href="#data">Open popup</a> 

    <div style="display:none"><div id="data"> 
     <input id="datepicker" type="text"> 
    </div></div> 
</html> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("a#inline").fancybox(); 
     $("#datepicker").datepicker(); 
    }); 
</script> 
+1

什麼是你正在使用的fancybox版本的z-index,你可以檢查CSS嗎? – 2010-08-17 12:21:43

回答

12

您需要設置日期選擇比的fancybox的更高的Z指數。 fancybox z-index是1101,只需將日期選擇器設置爲1102或更高,它應該將日期選擇器放在前面。

+0

Upvote提及fancybox使用的z-index。這是一個缺乏其他解釋的關鍵細節,這讓我想到「呃 - 一千個應該就夠了」。 – 2015-08-06 14:58:09

2

使用CSS - .datepicker{ z-index: 999999; }

1

.fancybox-內{溢出:可見重要;}

這對我的作品