移除/移动Google Chrome左下方状态栏(链接地址栏)

Question

我正在一个网站上设计,左下角有一个关键的导航元素.在谷歌浏览器中,左下角有一个状态栏,当您翻转页面上的链接并显示该页面的URL时,会出现该状态栏.虽然如果你足够近,这会移动到右下方.这妨碍了这个导航元素.

我的问题是可以使用CSS,HTML或JavaScript删除/移动(右下角)吗？请参阅下面的一些注释.

• 理想情况下,我想永久地向右移动它.
• 我知道这是必需/最佳实践,原因很多,所以我想避免删除.
• 我知道我可以从链接中删除href并使用onClick事件,这可能是一种可能的解决方法,但在这种情况下向右移动将是一个更好的解决方案.
• 我也确定无论如何都要对这个导航元素左下方进行大规模的辩论,但我正在寻找一个我必须使用的参数内的解决方案.

谢谢

Answer 1

Chrome会从您的链接中读取HREF属性,以显示状态栏中的链接.

因此,如果从A标签中删除HREF,则不会显示状态栏.但是链接也不起作用,:).这就是为什么你可以在MouseOver上创建一个事件处理程序来解决这个问题,并保持你的链接正常工作.

$("body").on('mouseover', 'a', function (e) {
    var $link = $(this),
        href = $link.attr('href') || $link.data("href");

    $link.off('click.chrome');
    $link.on('click.chrome', function () {
        window.location.href = href;
    })
    .attr('data-href', href) //keeps track of the href value
    .css({ cursor: 'pointer' })
    .removeAttr('href'); // <- this is what stops Chrome to display status bar
});

您可能会遇到其他问题,例如已禁用的链接或具有其他事件处理程序的链接.在这种情况下,你可以调整你的选择器,'a:not(.disabled)'或者只是将这个委托添加到css类的已知元素".disable-status",因此你的选择器将是:"a.disable-status".