PHP和jQuery-根据主体类或滚动顶部更改href？

Question

I would like the onclick of the logo to scroll to the top (home page) if clicked from the home page (one page scroll website) and if on an internal page then the logo link to remain as the site url.

My client basically does not want the site to reload onclick of the logo from the home page.

What would be the best way to do this? I have thought of 2 ways so far...

1. Replace the href attribute with the url + body class (my menu links use this and scroll to each section without reloading the page)
2. If click on logo when body hasclass .home, scroll to the top of the window. But I'm not sure if this would override the url set by the theme?

This is a snippet of how the logo href is set from the partials/menus.php file...

$logoDiv = '<a href="'.esc_url( home_url( '/' ) ).'" class="navbar-brand" data-minheight="'.(($LOGO->logo_min == "") ? "20" : esc_attr($LOGO->logo_min)).'">';

I am using the Uncode theme on Wordpress. And I am a newbie at PHP and jQuery... Just a suggestion as the best way to go about this would be greatly appreciated, and I can try and work through it myself!

Thank you :)

Answer 1

You can use the below code

$logoDiv = '<a href="javascript:void(0)" class="navbar-brand" data-minheight="'.(($LOGO->logo_min == "") ? "20" : esc_attr($LOGO->logo_min)).'" onclick="window.scrollTo(0,0);">';

Hope it may help you

Answer 2

You can check if your current link is the homepage before rendering the page:

$href = ($_SERVER["REQUEST_URI"]==home_url("","relative")?"#":esc_url( home_url( '/' ) ))

$logoDiv = '<a href="'.$href.'" class="navbar-brand" data-minheight="'.(($LOGO->logo_min == "") ? "20" : esc_attr($LOGO->logo_min)).'">';

If you wish to animate the scroll then you can add the following jQuery:

$("[href='#']").on("click", function (e) {
    e.preventDefault();
     $('html, body').animate({
        scrollTop: 0
     });
});

This would work on all links with href='#' if you want to limit it you'd need a more specific selector.

As your comment suggests, you can also do this with jQuery if you have a way to determine if your current page is the home-page.

Your solution should work:

$(document).ready(function() { 
    if($(body).hasClass("home")){ 
        $(".navbar-brand[href='ldngrp.co']").attr('href', '#'); 
     }
});