0

我需要一个 jQuery 函数的帮助，它允许我使用主题标签滚动到 .load() 页面上的锚点。

基本上有人点击主页链接，它会打开一个模型窗口，他们用它来浏览网站的其余部分。然后，此窗口使用相同的代码打开站点上的任何其他链接。我知道这些链接的格式不是最佳的，但这是我需要使用的。

我有以下代码显示在模型窗口中。

<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>

当有人单击其中一个链接时，它将通过以下代码：

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

未经测试，但是当我正确理解您的问题时，您可以像这样修改 pop 函数：

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 回答