我将这个 jQuery 用于一个名为 zoombox 的(优秀的)类似灯箱的插件:
$('a.zoombox').zoombox({...});
它采用 http://vimeo.com/15171582
形式的 a
链接,解析 vimeo id (15171582) 并弹出一个加载 的灯箱code>iframe
与此 URL:
http://player.vimeo.com/video/15171582?autoplay=1&title=0&byline=0&portrait=0&wmode=transparent
如何修改 jQuery,以便在移动浏览器上查看时
- 灯箱未启动,并且
- 简单链接被转换为
iframe
链接?
最佳答案
你可以使用这个:http://detectmobilebrowsers.com/检测移动设备。
或者像这样检测窗口宽度:
function isMobile() {
if(window.innerWidth <= 600) {
return true;
} else {
return false;
}
}
并让它像这样响应:
// keep original url
$('a.zoombox').each(function() {
var url = $(this).attr('href');
$(this).data('url',url);
});
// on load
doMagic();
// resizing
$(window).resize(function() {
doMagic();
});
// lightbox?
function doMagic() {
$('a.zoombox').each(function() {
var url = $(this).data('url');
$(this).attr('href',url);
});
if (!isMobile) {
$('a.zoombox').zoombox({...}); // lightbox here
}
}
// detect mobile
function isMobile() {
if(window.innerWidth <= 600) {
return true;
} else {
return false;
}
}
未测试
编辑:在加载时添加 doMagic 调用..
关于javascript - 如何仅在非移动浏览器上运行 jQuery?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16656006/