Question

我正在制作一个网站，并且在ipad上使用fancybox pdf滚动有一点问题。为了解决这个问题，我想在人们在ipad上查看我的页面时再做一次动作....

这是我的代码

<a href="http://xx.xx/xx.pdf" class="pdf">Open pdf</a>

这是脚本

      <script type="text/javascript">
var isMobile = {
Android: function() {
    return navigator.userAgent.match(/Android/i);
},
BlackBerry: function() {
    return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function() {
    return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function() {
    return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function() {
    return navigator.userAgent.match(/IEMobile/i);
},
any: function() {
    return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};

$(document).ready(function() {

    $(".pdf").fancybox({
           'type'  : 'iframe',
        openEffect  : 'none',
        closeEffect : 'none',
        iframe : {
            preload: false
        }
    });

    $(".pdf").click(function() {
    if( isMobile.iOS() || isMobile.Android() ){
             e.preventDefault();
            $('.pdf').attr('target', '_blank');
            $(".pdf").removeClass("pdf");
    }
}); 
});
</script>

当我在我的ipad中打开网站时，它不会在新选项卡中打开页面，但它会保留原始操作在fancybox中打开。有没有人可以帮助我？

Answer 1

如果iPad是您要修改的唯一设备，则应仅检测iPad ...

navigator.userAgent.match(/iPad/i)

$(document).ready(function() {
    if (!navigator.userAgent.match(/iPad/i)) {
        $(".pdf").fancybox({
            'type': 'iframe',
            openEffect: 'none',
            closeEffect: 'none',
            iframe: {
                preload: false
            }
        });
    } else {
        $(".pdf").attr("target", "_blank");
    }
});

根据设备的不同操作（HTML，JQUERY）

1 个答案: