/ / JQuery Lightbox - オーバーレイを特定のdivに限定する - ページ全体ではない - jquery、css

JQueryライトボックス - 特定のdivにオーバーレイを限定する - ページ全体ではない - jquery、css

これを理解するために何日も費やしてきましたが、おそらく不可能です。

私はライトボックス機能を備えた複数のギャラリーにjqueryライトボックスと個別のメインページナビゲーションを使用しています。

jqueryライトボックスオーバーレイをdiv内にネストしたいのですが、ウィンドウ全体をカバーするのではなく、それが含まれているdivにのみ関連するのですか。

その理由 - メインのナビゲーションをお願いしますオーバーレイをクリックしなくてもアクセスできるようにするには、ライトボックスのコンテンツを設定されたパラメータ(ページのコンテナ)内に収める必要があります。

可能であれば、これを可能にするために使用するjqueryスクリプト、アドオンに関するアドバイス。 または他の提案は大歓迎です。

ありがとうございました

回答:

回答№1は1

私はあなたが「ライトボックスプラグイン」が提供するオーバーレイを廃止してあなた自身でやる必要があると思うでしょう。

オーバーレイを作成するプロセスは簡単です。私はここで車輪を再発明することができます、あるいは私はちょうどあなたにこのブログ記事のような何かを送ることができます: http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

クラスがオーバーレイのdivを見てください。 #overlay?コンテナのサイズに合わせるために必要なことは、そのコンテナ内にオーバーレイdivを配置してコンテナスタイルを設定することだけです。 position: relative.

その投稿をすべて無視することを選択できますJavaScript側で実装し、それをお気に入りのモーダルプラグインで置き換えることができますが、カスタムオーバーレイを表示/非表示にするには、モーダルダイアログのshow / hideイベントにバインドする必要があります。これを行う方法は、選択したプラグインによって異なります。


回答№2の場合は0

ライトボックスがページの下にロードされているという問題に直面していました。問題は、コードを含むcssファイルにあることです。

ライトボックスがページの下にロードされたとき 私はこの行を書いた

<link  type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />

linkタグにrel = "stylesheet"のみを含める

<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />

私の問題は解決しました