Якорная ссылка идет на страницу, не найденную вместо раздела на той же странице - PullRequest
Новая
       11

Якорная ссылка идет на страницу, не найденную вместо раздела на той же странице

0 голосов
/ 07 октября 2019

У меня есть часть разметки, где, когда пользователь нажимает кнопку «найти гонщика», браузер должен привести пользователя туда, где участники находятся на той же странице. Но при переходе по ссылке я просто перехожу на страницу, не найденную в chrome, edge и firefox (не могу проверить safari). 

<div class="container-fluid blue">
    <div class="container text-center">
        <h1 class="white">Prairie Women on Snowmobiles</h1>
        <a href="#find" class="btn white main-cta elevation-z12" style="margin-bottom: 60px;">Find a Rider</a>
        <div class="row">
            <div class="col-lg-12" style="margin-bottom: 15px;">
                <div class="hero elevation-z12" style="background-image: url('../images/content/pagebuilder/PWOS_banner.jpg');"></div>
            </div>
        </div>
    </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-lg-12">
            <h2 class="text-center">Prairie Women on Snowmobiles</h2>
            <p>A non-profit organization whose annual missions are provincial awareness events that are designed to focus attention on breast cancer and the recreation of snowmobiling as well as raise the much-needed funds for breast cancer research. Over the past 18 years we have raised almost $2.5 million for the cause. To learn more about Prairie Women on Snowmobiles <a href="../site/SPageServer/?pagename=PWOS_SK_About">click here</a>.</p>
        </div>
    </div>
    <div class="container">
        <div class="text-center">
            <h2>Riders</h2>
            <p>Meet our 2020 Riders</p>
        </div>
        <div class="events">
            <div class="event-display" id="find">
                [[S51:PWOS_SK_reus_riders]]
            </div>
        </div>
    </div>
</div>

обычно, чтобы это исправить, я бы просто поместил URL вссылка "../site/SPageServer/?pagename=PWOS_SK_homepage#find", и это работает, однако, это нарушит отслеживание моего URL, если люди попадут на страницу, используя URL-адрес тщеславия.

Вот ссылка настраница:

https://secure2.convio.net/cco/site/SPageServer/?pagename=PWOS_SK_homepage

любая помощь приветствуется.

спасибо,

Ответы [ 3 ]

2 голосов
/ 07 октября 2019

Ваша страница начинается с <base href="https://secure2.convio.net/cco/site/" />, поэтому, когда вы нажимаете href="#find", она разрешается до https://secure2.convio.net/cco/site/#find.

Вам нужно написать свой URL относительно базового URL, а не текущей страницы.

0 голосов
/ 08 октября 2019

Как упомянуто в комментарии, было бы лучше сделать это с простым JS, а не играть с функциональностью браузера. Не касаясь HTML и предполагая, что у вас есть jQuery на сайте, я бы добавил что-то вроде следующего в тег скрипта (очевидно, под <a href='#find'> и div#find) 

jQuery("a[href='#find']").click(function() {
    event.preventDefault();
    jQuery("body, html").animate({ 
        scrollTop: jQuery("#find").offset().top 
    });
})

Это позволяет вамоставайтесь на странице, не связывая / не испуская данные отслеживания, в то время как окно будет прокручиваться до нужного элемента независимо от того, как далеко вниз. Надеюсь, это поможет (даже если вы справились до меня;))

0 голосов
/ 07 октября 2019

При наведении указателя мыши на ссылку вы видите:

https://secure2.convio.net/cco/site/#find

, но ожидаете:

https://secure2.convio.net/cco/site/SPageServer/?pagename=PWOS_SK_homepage#find

Этовызвано тегом в шапке.

...