0

ハッシュタグを使用して.load（）ページのアンカーポイントまでスクロールできるようにするjQuery関数のヘルプが必要です。

基本的に、誰かがホームページのリンクをクリックすると、Webサイトの残りの部分をナビゲートするために使用するモデルウィンドウが開きます。次に、このウィンドウは同じコードを使用して、サイト上の他のリンクを開きます。これらのリンクの形式が最適ではないことは知っていますが、それを使用する必要があります。

モデルウィンドウに表示される次のコードがあります。

<div id="pop-top-menu">
  <p class="p_text">
    <a href="javascript:pop('properties.php#<?php echo strip_tags($_GET['property']); ?>');">Go Back</a> |
    <a href="javascript:pop('properties.php');">View by Resorts</a> |
    <a href="javascript:pop('private-homes.php');">View our Private Homes</a> |
    <a href="javascript:pop('rental-coupons.php');">View our Properties with Discount Coupons</a></p>
</div>

誰かがそれらのリンクの1つをクリックすると、次のコードを通過します。

function pop(id) {
        $("#body-cover").fadeIn(1000);
        $("#slide-content").load(id).slideDown(1000);
        $("#slide-content-close").delay(2000).fadeIn(1000);
    }

したがって、訪問者にproperties.php＃property_idをクリックしてもらい、ページproperties.phpをロードしてから、アンカータグに移動する必要があります。すべてのリンクにアンカーがあるわけではありませんが、多くのリンクにアンカーがあります。

これはアンカーベースのナビゲーションではないことに注意してください。これはリンクをロードし、提供されたアンカー（存在する場合）に移動します。

4

1 に答える 1

2

テストされていませんが、あなたの質問を正しく理解したら、次のようにポップ関数を変更できます。

function pop(id) {
    // Expression to test if id has a hashtag
    var hasHash = /(#([^ ]*)/, 
        $hashID;
    $("#body-cover").fadeIn(1000);
    $("#slide-content").load(id).slideDown(1000);
    $("#slide-content-close").delay(2000).fadeIn(1000);
    if(hasHash.test(id)!== false) {
        // hasfound - grep it, and make a jQuery Object
        $hashID = $('#' + id.split('#')[1]);
        if($hashID.length) {
            // if it is found, scroll to this element with an animation
            // in case you just want a jump, simply set scrollTop 
            // and remove the animate method
            $('html, body').animate({
                 scrollTop: $hashID.offset().top
            }, 2000);
        }
    }
}
于 2013-03-07T06:34:55.227 に答える