悬停在链接上时如何隐藏浏览器底部显示的网址？答案

【问题标题】：How to hide url shown at bottom of browser when hover on link?悬停在链接上时如何隐藏浏览器底部显示的网址？
【发布时间】：2017-11-13 16:23:58
【问题描述】：

我正在使用带有 iframe true 选项的颜色框来打开链接。

在fancybox中，当鼠标悬停在链接按钮上时，我使用了一个代码来隐藏浏览器底部显示的url。

但我不知道如何为 colorbox 做这件事。

我想要以下代码的解决方案：

<script>
$(document).ready(function(){
   $(".iframecolor").colorbox({
       iframe:true, width:"80%", height:"80%"
   });
});
</script>

而<a>使用的标签如下：

<a class="iframecolor btn btn-success" href="http://www.linkofwebsite.com">VIEW NOW</a>

当我们将鼠标悬停在 VIEW NOW 按钮上时，我希望隐藏在浏览器底部显示 http://www.linkofwebsite.com。

================================================ ===========

前面使用的fancybox的工作代码如下：

<script type="text/javascript">
      $(document).ready(function() {
        $('.fancybox').fancybox();          

        $("#fancybox-manual-b").click(function() {
            $.fancybox.open({
                href : 'test.html',
                type : 'iframe',
                padding : 5
            });
        });

        $(".fancy").fancybox(); // ***This worked for fancybox to hide url  
    });
</script>

<a>标签中的AND，使用代码如下：

<a class="fancybox fancybox.iframe more_info_btn" data-fancybox-href="http://www.linkofwebsite.com">VIEW NOW</a>

【问题讨论】：

可能重复：stackoverflow.com/questions/9851372/…
how can url be hidden in hyperlink when mouse hover的可能重复

标签： javascript html

【解决方案1】：

根据 colorbox 文档，它可以接受一个 href 参数，就像你对 fancybox 所做的那样

<script>
    $(document).ready(function(){
    $(".iframecolor").colorbox({
        iframe:true, 
        width:"80%", 
        height:"80%",
        href:"http://linkofwebsite.com"
    });
 });
</script>
<a class="iframecolor btn btn-success" href="#">VIEW NOW</a>

http://www.jacklmoore.com/colorbox/

【讨论】：