ECode1024|网页移动手机端判断控制显示,一段js即可搞定!

本文由cinco原创首发于ECode1024,原文地址:https://www.xinke.org.cn/article/detail/763

我们在开发网站的时候,会兼顾两种客户端,一种是pc端,一种是mobile端,我们知道这两种客户端不可能做到显示内容一致,那么我们在mobile端显示的时候可能要抛弃很多的内容,现在有这样一个真实的需求:

ECode1024官网,在pc端打开的时候显示最顶部的扩展栏:

而在mobile端打开的时候我们希望隐藏最顶部的扩展栏:


然后,我们来分析一下,问题实际上就是如何使用js去正确的判断当前客户端是否是mobile端,如果是,就调用dom的remove或者hide方法去移除或者隐藏都可。

$('#top-box').hide();

$('#top-box').remove();

最后,判断客户端的js代码其实很简单,具体如下:

// 网站顶部扩展栏,手机和pc端控制显示 if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {

        $('#top-box').remove();

}

注意:以上这段js代码最好放到公共的js文件中去,方便页面统一自动加载使用。

本文由cinco首发于ECode1024,未经允许,禁止转载复制!

你可能感兴趣的:(ECode1024|网页移动手机端判断控制显示,一段js即可搞定!)