2016-05-17 5 views
0

私はホームページにOpentable javascript reservationウィジェットを追加しました。モジュールには、3つのドロップダウン、カレンダー、日付セレクター、およびタイムセレクターがあります。 2番目の2つのドロップダウンは、私がz-indexを使って前方へ移動させて見えるようにしても反応しません。z-indexを使用してドロップダウンが停止した後

私はCSSに何か間違っていると思っていますが、解決できないようです。それとも、jsと競合しているのでしょうか?わからない。助言がありますか?おかげで - 私は実際に共有するために、ここで我慢するどのようなコードでもわからないんだけど、サイトのdevのサーバー上で、ここで、http://aac.myftpupload.com/

screenshot of dropdown issue

...それは以下がopentableによって提供されたスクリプト、およびそれが多分、私のサイトと競合するが、私はよく分からないCSSのトンが付属しています:

</div><div class="wpb_column vc_column_container vc_col-sm-9"><div class="vc_column-inner wpex-clr"><div class="wpb_wrapper wpex-vc-column-wrapper wpex-clr " style="min-height:40px;"> 
<div class="wpb_raw_code wpb_raw_js"> 
    <div class="wpb_wrapper"> 
     <script src="https://secure.opentable.com/frontdoor/default.aspx?rid=82057&amp;restref=6543&amp;bgcolor=F6F6F3&amp;titlecolor=0F0F0F&amp;subtitlecolor=0F0F0F&amp;btnbgimage=https://secure.opentable.com/frontdoor/img/ot_btn_red.png&amp;otlink=FFFFFF&amp;icon=dark&amp;mode=wide&amp;hover=1" type="text/javascript"></script> 
    </div> 

の一部dropwownためのCSSは次のとおりです。で

element.style { 
    display: block; 
} 

#OT_timeList, #OT_partyList { 
    width: 108px; 
    max-height: 200px; 
    overflow: auto; 
    border-left: 2px solid #b8b4ac; 
    border-right: 2px solid #b8b4ac; 
    border-bottom: 2px solid #b8b4ac; 
    position: absolute; 
    top: 34px; 
    left: 39px; 
    display: none; 
} 

.entry ul, .entry ol { 
    margin: 0 0 10px 10px; 
} 

.entry ul { 
    list-style: disc; 
} 

.entry ul, .entry ol { 
    margin: 0 0 20px 30px; 
} 

.OT_navList { 
    list-style: none; 
    padding: 0; 
    margin: 0; 
    float: left; 
    width: 142px; 
    position: absolute; 
    background-color: #fff; 
    z-index: 200; 
    top: 35px; 
    left: 0; 
} 
+0

質問内で関連するコードサンプルを提供すると、ユーザーはおそらくより迅速に対応できます。 – martieva

+0

ありがとう@martieva、私はいくつかのコードを追加しましたが、それが正しい部分であるかどうかは分かりません! – TitoNYC

答えて

0

div "rev_slider_6_1_wrapper" position: relative; z-index: -1;を設定しました。これにより、画像とテキストの前にドロップダウンが表示されました。これはマイナスのあなたのonloadのいずれかの効果に影響する場合

<div id="rev_slider_6_1_wrapper" class="rev_slider_wrapper fullwidthbanner-container" style="margin: 0px auto; padding: 0px; max-width: 1000px; height: 400px; overflow: visible; position: relative; z-index: -1;"> 

が、私はわからないんだけど、それは取得する必要があります何もない場合は、正しい方向に開始しました:

だから、div要素は次のようになります。

+0

ありがとうございます。はい、ドロップダウンを先に持っていますが、私が把握できないのは、この2つのドロップダウンがこのページで機能しない理由です。あなたはトップアイテムのみを選ぶことができ、またはトップアイテムからスクロールすることができ、残りは一種の「死んだ」ものです。スクリプトは空のページで動作します。 – TitoNYC

0

テンプレートを挿入していて、ドロップダウンがスライダの背後にあり、機能していないと思われるいくつかの奇妙なコードがありました。

css_animation="appear" 
関連する問題