【问题标题】:Hiding tel: link on desktops隐藏电话:桌面上的链接
【发布时间】:2013-07-04 09:35:33
【问题描述】:

在这个网站上Site link 我在右上角有一个联系信息和电话:移动设备的链接。我们如何以最好(最简单)的方式隐藏 tel: 桌面上的链接? 现在我有了这个:

CSS:

#header .contact-info1 { width: 253px; height: 50px; display: block; float: right;     background: url(contact-info1.png) 0 0 no-repeat transparent; margin-right: 39px; margin-    top: 110px; }
#header .contact-info2 { width: 292px; height: 51px; display: block; float: right;     background: url(contact-info2.png) 0 0 no-repeat transparent; margin-right: 0px; margin-    top: 30px; }

@media only screen and (max-device-width: 480px) {
#header .contact-info1-mobile { width: 253px; height: 50px; display: block; float:     right; cursor: pointer; background: url(contact-info1.png) 0 0 no-repeat transparent;     margin-right: 39px; margin-top: 110px; }
#header .contact-info2-mobile { width: 292px; height: 51px; display: block; float:     right; cursor: pointer; background: url(contact-info2.png) 0 0 no-repeat transparent;     margin-right: 0px; margin-top: 30px; }

HTML:

<a href="tel:+491796737741" class="contact-info1-mobile" ></a>
<div style="clear:right"></div>
<a href="mailto:info@rw-fliesen.com" class="contact-info2-mobile" ></a>

目前我正在隐藏台式机的链接,但如何隐藏台式机的链接并同时显示台式机的联系人图像?

【问题讨论】:

  • 嘿,我的 SGS3 手机在窄(垂直)模式下的设备宽度为 720 像素,而 SGS4 有 1080 像素(垂直)和 1920 像素水平。如果您在屏幕像素上检测到移动设备,它会在很短的时间内变坏。
  • 您可以使用javascriptjquery 来实现这一点,点击这里see
  • 好的,谢谢。有没有可以推荐的链接源在 javascript 或 jquery 中执行?
  • 点击我评论上的see链接

标签: html css mobile


【解决方案1】:

您也可以通过 $(window).resize 使用 jquery 来做到这一点

$(window).resize(function() {
    var width = $(window).width();
    if (width < 750) {
        // Do Something
    }
    else {
        //Do Something Else
    }
});

另一种选择是使用jQuery or javascript检测浏览器作为我评论中提及的链接

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-05-10
    • 2011-09-29
    • 2015-01-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-05-26
    相关资源
    最近更新 更多