如果在移动设备上查看,则显示弹出窗口

时间:2012-11-01 13:57:36

标签: javascript redirect mobile

我有一个网站需要将移动用户重定向到移动网站,但是由于这些网站位于不同的地方,我无法设置cookie以便记住它们是否来自移动网站。因此,有一个连续循环。

我现在要做的就是在用户正在手机上查看时显示弹出窗口,为他们提供在手机上查看网站或取消查看完整网站的选项。

我知道这在Javascript / jQuery中是可行的,但我不知道如何去做。

有人可以帮帮我吗?

由于

4 个答案:

答案 0 :(得分:3)

试试这个......

// Check for mobile user agent
var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));
if (mobile) {
    //alert("MOBILE DEVICE DETECTED");              
} else {
    //alert("NO MOBILE DEVICE DETECTED");
}  

答案 1 :(得分:3)

您只需将弹出窗口添加到HTML中,默认将其隐藏,如果它是使用CSS的移动设备,则显示它。

/* hidden on default */
div#popup { display: none; }

/* use a media query to filter small devices */
@media only screen and (max-device-width:480px) {
    /* show the popup */
    div#popup { display: block; }
}

到目前为止,这是性能方面的最佳选择。所有现代手机都支持媒体查询,因此您也不会遇到任何问题。

只需添加两个链接,要求用户转到桌面网站或移动网站。如果他选择桌面网站,您可以使用服务器端语言保留弹出窗口,或者只使用javascript删除弹出窗口。

答案 2 :(得分:2)

您可以检查用户代理。 Here您可以获得详细信息。

答案 3 :(得分:0)

以下是我过去用来检测移动设备的一些代码:

var ua=navigator.userAgent.toLowerCase();
var isMobile = 
   screen.width < 500 ||
   ua.indexOf('mobile')!=-1 ||
   ua.indexOf('iphone')!=-1 ||
   ua.indexOf('ipod')!=-1 ||
   ua.indexOf('blackberry')!=-1 ||
   ua.indexOf('windows phone')!=-1 ||
   ua.indexOf('zunewp7')!=-1) && 
   ua.indexOf('tablet')==-1 &&
   ua.indexOf('playbook')==-1 &&
   ua.indexOf('webos')==-1 &&
   ua.indexOf('ipad')==-1;

这应该可以检测到iPhone,iPod,黑莓,Windows手机,ZuneWP7,大多数Android手机以及许多其他手机。对于大多数安卓平板电脑,黑莓手机,WebOS设备,iPad和许多其他平板电脑来说,这将是假的。