2

現在、サムネイルをクリックするとモーダルポップアップを開くギャラリーがあります。私がやりたいのは、モーダル専用の一意のリンク(つまり、www.mywebite.com /#link1)を生成できるようにすることです。このリンクは、ajaxを介してコンテンツをロードします。誰かがこのユニークなモーダルリンクを送信して誰かに送信し、それをブラウザに貼り付ける場合、理想的には、ユーザーが適切なサムネイルをクリックしなくても、モーダルウィンドウにコンテンツが自動的に読み込まれて表示されるようにします。

これも可能ですか?私はこれが最も簡単なタスクではないことを知っています、そしてこれに関するどんな助けも大いにありがたいです。

私が取り組んでいることのアイデアを得るには、 http ://www.ddbremedy.co.uk/siteupdate/workにアクセスしてください。

サムネイルが表示されたiMac画面が表示されます。

よろしくお願いします。

アップデート!!!!!

わかりました、これは私が現在いるところです。jqueryアドレスを使用してスクラップすることにし、代わりに「window.location.hash」を使用してディープリンクしています。

コードは次のようなものです。

var base_url = "http://www.ddbremedy.co.uk/siteupdate/";

$('#work_gallery li a').on('click', function(event) {

    event.preventDefault();
    postLink = $(this).attr('href');
    window.location.hash = postLink.replace(base_url, "");


    /* I have a bunch of code that animates the modal window 
    in which I don't need to include as there is quite alot of it.
    Content loads via ajax. Then when I close the modal I add this 
    code to remove the hash and revert the link back to its original state. */

    if ("pushState" in history) {
        history.pushState("", document.title, window.location.pathname);
    } else {
        window.location.hash = "";
    }

});

上記のコードは正常に機能し、ajaxを使用して外部コンテンツをロードして閉じるときに希望どおりにリンクを表示します。ここで理解する必要があるのは、誰かがそのリンクを取得してアドレスバーに貼り付けた場合に、ajaxコンテンツを自動的にロードする方法です。コンテンツはリンクhrefとクリックイベントに基づいて読み込まれます。ブラウザをだまして正しいリンクがクリックされたと思い込ませ、純粋にそのリンクに基づいて正しいコンテンツを読み込むにはどうすればよいでしょうか。

4

2 に答える 2

3

それを機能させることができました。これは私がそれをした方法です:

まず、URLをチェックしてハッシュが含まれているかどうかを確認する「checkUrl」という関数を実行します。

checkUrl = function() {
    if (window.location.hash) {

    }
};

checkUrl();

次に、ifステートメント内で、ハッシュパスを変数に格納し、ハッシュから分割します。次に、ハッシュの後の文字列を変数に格納します。

var pathname = window.location.hash,
    rez = pathname.split('#'),
    linkUrl = rez[1];

次に、その変数をその特定のhrefを持つリンクのセレクターとして渡し、対応するリンクでクリックイベントをトリガーします。これにより、正しいモーダルがアニメーション化されて読み込まれます。

$("a[href='http://www.ddbremedy.co.uk/siteupdate/" + linkUrl + "']").trigger('click');

うまくいけば、これは将来誰かを助けるでしょう。

于 2013-03-26T10:59:36.413 に答える
1

これは完全に可能です。jquery simplemodalを使用したセミ擬似コード:

$(document).ready(function () {
    /* Get the hash from window.location */
    var theHash = window.location.hash;
    if (theHash !== '') 
    {
        /* Load something related to it */
        $.get(something-from-somewhere, function(data) {
           /* Open the simplemodal and put the returned data inside it */
           $.modal(data);
        });
    }
});

明らかに、モーダルで実行できる負荷は他にもあります。これは、ドキュメントに記載されています。

于 2013-03-22T15:28:07.377 に答える