Question

我想创建一个div，在桌面上悬停显示另一个div，但点击移动设备。

这可能吗？

Answer 1

以下代码可以帮助您..

var isAndroid = /android/i.test(navigator.userAgent.toLowerCase());
var isWindows = /windows phone/i.test(navigator.userAgent.toLowerCase());
var isBlackberry = /blackberry/i.test(navigator.userAgent.toLowerCase());
var isiDevice = /ipad|iphone|ipod/i.test(navigator.userAgent.toLowerCase());

if(isAndroid || isWindows || isBlackberry || isiDevice){
    $('#element').on('click',function(){
         //your code here
    });
}else{
    $('#element').on('hover',function(){
         //your code here
    });
}

或者您可以看到以下帖子......

http://www.jquery4u.com/mobile/detect-mobile-devices-jquery/

Answer 2

if screen size mobile{

  $("#element).click(some function)
}
else if screen size desktop{
  $("#element).hover(some function)
}

或其他解决方法

$("#element").click(function(){
   if(screen size is mobile){
     //do something (show div)
   }
   else if(screen size is desktop){
     //do something
   }
});

$("#element").hover(function(){
   if(screen size is mobile){
     //do something 
   }
   else if(screen size is desktop){
     //do something (show div)
   }
});

Answer 3

结合下面的Sixin和CSS TRICKS答案：

if ($(window).width() < 960) {

  $("#element").click(function(){

        var e = document.getElementById("foo");
        if(e.style.display == 'block')
           e.style.display = 'none';
        else
           e.style.display = 'block';
  });
}
else {

  $("#element").hover(function(){

        var e = document.getElementById("foo");
        if(e.style.display == 'block')
           e.style.display = 'none';
        else
           e.style.display = 'block';

  });
}

在桌面上显示DIV，然后单击“移动”

3 个答案: