jqueryライトボックスプラグインカラーボックスを使用してページを開くためのURLを構築するにはどうすればよいですか?

StackOverflow https://stackoverflow.com/questions/1383304

  •  21-09-2019
  •  | 
  •  

質問

私はjqueryライトボックスプラグインカラーボックスを使用しています(http://colorpowered.com/colorbox/）そして、ユーザーを自分のWebサイトに送り、ライトボックススクリプト内でiframeページ（about-me.html）を開くwww.example.com/about-me.htmlのようなURLを構築できるようにしたいと考えています。

イベントフックか何かを使用する必要があると思いますが、結果を達成する方法がわかりません。助けていただければ幸いです。

役に立ちましたか？

解決

クレジットはカラーボックスのGoogleのグループにジャック・ムーアになります。

彼の解決策は、この質問に適応しました 

var url = document.location.href;
if(url.search(/\?about-me/i) !== -1){
    $(".iframe:first").click();

}

URLはwww.example.com?about-meになるので、これはホームページにユーザーを取るだろうし、このJavaScriptは、そのパラメータを見つけて、それを開くためにカラーボックスを教えてくれます。

元のGoogleグループのスレッドや詳細：のhttp：/ /groups.google.com/する

他のヒント

編集 -

以下の私の例のソースコードを更新しました

私はそれをライトボックスに精通していないが、私はあなたがする必要があるすべてのページを作成し、同じようwindow.loadやDOM準備にライトボックスを呼び出していることを前提となります：

$(document).ready(function () {
   if(document.location.hash){
    //launch colorbox and use this hash
    $.fn.colorbox({width:"50%", inline:true, href:""+document.location.hash+""});
   }
});

見てください 例 他のコンテンツにアクセスする方法について。あなたの質問が正しく理解できれば、iframe に外部ソースを表示したいということになります。以下を使用してそれを行うことができます。

(サンプルページより)

$(".iframe").colorbox({iframe:true});

<p><a class='iframe' href="http://google.com">Outside webpage (IFrame)</a></p>

アップデート:URL を入力したときに上記のコードのようなものがページに表示されるようにしたい場合は、パラメーターまたは URL 書き換えを使用してそれを実現することをお勧めします。アイデアとしては、URL に iframe に読み込むページが含まれており、サーバー上でこれを抽出して、ページ上に上記のコードのようなものを構築するために使用するということになります。

http://www.example.com/main?load=about.htm

または、MVC などを使用すると、次のようになります。

http://www.example.com/main/about

これにより、メイン コントローラーで about アクションが呼び出されます。これにより、「about.htm」コンテンツ ファイルを iframe に挿入するコードを含むビューがレンダリングされます。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top