我有一个问题:html锚在chrome和safari中不起作用。页面下降而不是上升。
我有这个HTML:

<a id="to-top"></a>
<a class="button toTop" href="#" onclick="document.getElementById('to-top').scrollIntoView(true);return false;">Вверх</a>


这段JavaScript代码:

var topScreen = window.pageYOffset ? window.pageYOffset : document.body.scrollTop;
        var myScreen = screen.availHeight;
        if(topScreen > (myScreen / 3)) {
            $(".toTop").fadeTo(0, 1.0);
        }
        else {
            $(".toTop").fadeTo(0, 0);


SCSS:

.toTop {
        display: none;
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 999999;
        transition: opacity 1s ease-out;
        outline: none;
        &:hover {
            transition-delay:0s;
        }
        a {
            color: #fff;
            text-decoration: none;
            &:hover {
                color: #000;
            }
        }
    }


怎么了?此外,此元素在单击后仍保持焦点。

最佳答案

现在,由于您尚未设置JSFiddle,因此我们很难准确地了解您项目中正在发生的事情以及期望发生的事情。但是,我认为small fiddle可以解决您的问题。

的HTML

<div id="to-top"></div>
<a class="button toTop" href="#to-top">Вверх</a>


的CSS

#to-top {
    height: 200vh;
}


项目中的问题可能是您试图跳到另一个<a> -tag,而锚定跳转似乎仅适用于包含divid。请尝试我添加的小提琴,看看将to-top的元素更改为div是否对您有用。

将来,您确实应该在问题中添加自己的小提琴。

关于javascript - Anchor在Chrome和Safari浏览器中不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32095918/

10-12 00:21
查看更多