Question

如果从主页（单页滚动网站）点击，我希望徽标的onclick滚动到顶部（主页），如果在内部页面上，那么徽标链接将保留为站点URL。

我的客户基本上不希望网站从主页重新加载徽标。

最好的方法是什么？到目前为止，我已经想过两种方法......

用url + body类替换href属性（我的菜单链接使用它并滚动到每个部分而不重新加载页面）
如果在body hasclass .home时单击徽标，请滚动到窗口顶部。但我不确定这是否会覆盖主题设置的网址？

这是如何从partials / menus.php文件中设置徽标href的片段......

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

我在Wordpress上使用Uncode主题。而且我是PHP和jQuery的新手......只是一个建议，因为最好的方式去做这个将非常感激，我可以尝试自己完成它！

谢谢：）

Answer 1

您可以使用以下代码

$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);">';

希望它可以帮到你

Answer 2

您可以在呈现页面之前检查当前链接是否为主页：

$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)).'">';

如果您希望为滚动设置动画，则可以添加以下jQuery：

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

这适用于href='#'的所有链接，如果您想限制它，则需要更具体的选择器。

正如您的评论建议的那样，如果您有办法确定当前页面是否是主页，您也可以使用jQuery执行此操作。

您的解决方案应该有效：

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

PHP＆amp; jQuery - 根据body class或scrolltop更改href？

2 个答案: