0

あるホームページに表示される「トップ オブ ザ ウィーク」ボックスで忙しいです。少し前に厄介な小さな問題が発生しましたが、それが消えることを願っていましたが、これは時々起こり、低いレベルに沈みました.

ここで実際の例を参照してください。

左側に 3 つのサブ項目が表示され、ページ読み込み後、数秒ごとに順番に次の項目に移動します (1->2、2->3、3->1)。最初にアイテム #1 が表示され、アイテム #2 + #3 が非表示になり、親指 #2 をクリックした後、または数秒後に自動的にアイテム #1 が消え、アイテム #2 が表示されます / スライドイン / フェードイン / その他.. .

メイン アイテム #1、#2、および #3 の内部には、そのアイテムに関する情報を示すテキスト コンテンツを含むDIV1があります。

スタイリングは透明度 50 に設定されています。透明度が 100 未満の値に設定されているため、テキストが読みにくい場合があります。それを解決するには... ユーザーがDIV1をクリックすると、白い背景の別のDIV2がDIV1の後ろに表示されます。

（結合された）背景の透明度が低くなるため、テキストが読みやすくなります。

ページロード直後に正常に動作します (nav_to_slide2/3() は実行されません): DIV1 をクリックするとDIV2が表示されます。nav_to_slide1/2/3() が実行されている場合
は NOKで動作します。DIV1 をクリックすると、 DIV2が表示されません。

これ（またはsome.parent）はスライド/フェード効果のために変更する必要があったため、これは z-index のものと関係があると思いますか？

デバッグを試みましたが、修正が見つかりません。アラート =A=、=B=、および =C= は常に発生することに注意してください... NOK の場合でも。

ソース JQUERY コード

4

2 に答える 2

1

z-index は、配置された要素 (position:absolute、position:relative、または position:fixed) でのみ機能します。z-index を使用する div に
追加します。position:relative

于 2013-01-10T06:51:27.680 に答える
0

ここでは、「単純に愚かにしてください」が非常に適切です...
cssを使用して（stackoverflowで）解決策を見つけました：

div.box_slide_over_text, div.box_slide_over_text:hover {
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out; }

div.box_slide_over_text { opacity:0.45; filter:alpha(opacity=45); }
div.box_slide_over_text:hover { opacity:0.80; filter:alpha(opacity=80); }

対応する z-index を含むDIV2を完全に削除しました。固定バージョン コードについては、ライブ バージョン
を 確認してください。

于 2013-01-11T09:16:20.157 に答える