Question

我有一个运行Twitter Bootstrap的响应式网站，我有一个切换操作，当使用点击图片时，从页面顶部向下放一个联系表单。如果用户的屏幕尺寸低于660px宽，我想将点击操作更改为mailto。检测屏幕大小并将此切换更改为mailto的最佳方法是什么？

$("#contact-tab").toggle(function() {
    $('#contactme').attr("src", "/wp-content/themes/wordpress-bootstrap-child/img/close_btn.png");
    $('#contact-form-wrapper').slideToggle(
        function() {
        } 
    );
}, function() {
        $('#contactme').attr("src", "/wp-content/themes/wordpress-bootstrap-child/img/contact_me.png");
        $('#contact-form-wrapper').slideToggle(
            function() {
            } 
        );
});

Answer 1

这就像是：

$(function(){
   var winWidth = $(window).width();

   if(winWidth < 660){
      $("#contact-tab").click(function(){
         window.open('mailto: ... ');
      });
   } else {
      //go toggle ...
   }
});

Answer 2

$('html').width()应告诉您屏幕宽度

如何根据浏览器屏幕大小或类型更改jQuery单击操作

2 个答案: