highslide - highslide カスタム オーバーレイ Z インデックスを機能させるにはどうすればよいですか?

Question

ハイスライド カスタム オーバーレイを実装して、画像間を移動するための「次へ」と「前へ」のリンクを含めました。レスポンシブ Web サイトを作成しているため、リンクを画面に対して相対的にする必要があります。だから私は設定しhs.registerOverlay({ relativeTo: 'viewport' });ました。しかし、その後、含まれる要素のいずれかに強制する Z インデックスに関係なく、「次へ」および「前へ」のリンクが常にエキスパンダーの下に表示されます。Z-index を機能させるにはどうすればよいですか?

Answer 1

両方のオブジェクト (エキスパンダーとオーバーレイ) が Highslide スクリプト自体によってレンダリングされており、独自のスタック順序が課せられるため、z-index 値でこれに対処できるとは思いません。

この問題を解決する最も簡単な方法は、エキスパンダーのサイズを制限することです。リンクがビューポートの下部に配置されていて、高さが 30px であるとします。hs.bottomMargin をデフォルトの 15 から 45 に変更すれば問題ありません。