如何獲取JavaScript在桌面上運行功能，但不是在移動設備上

我正在使用畫布進行此操作。我有一張圖片，當用戶點擊我指定的其中一個元素時，它會突出顯示該元素描述的圖像部分。如何獲取JavaScript在桌面上運行功能，但不是在移動設備上

 $(function() { 
     $("#monsterTop").click(function() { 
      $("#container").css("position", "relative"); 
      $("#highlight").css("position", "absolute") 
          .css("width", "413px") 
          .css("height", "32px") 
          .css ("top", "0px") 
          .css("left", "0px") 
          .css("background", "rgba(255, 0, 0, 0.4)"); 
       }); 
      });

下面是相關的HTML代碼

<div id="container"> 
    <img src="../pictures/img/default.png" alt="Default page layout" class="adcanvas"/> 
    <div id="highlight"></div> 
</div>

我有一個偉大的工作，但圖片是太大了手機。所以我把這個在我的CSS：

@media(max-width: 826px){ 
    .adpics{ 
    display:inline-block; 
    width: 100%; 
    max-width: 500px; 
    } 
.adinfo{ 
    display:inline-block; 
    width:100%; 
    } 
    .adcanvas{ 
     display:none; 
    } 
}

這使得畫布（ID = adcanvas）消失在移動和顯示較大的圖像的縮略圖代替（ID = adpics）。

問題是，從JavaScript的突出顯示仍然顯示。我試過一個IF ELSE語句，告訴它只在窗口大於826時才運行，但它只是導致整個腳本不能在任何大小的屏幕上運行。

我如何告訴它不要在移動設備上運行#highlight？

Link到目前爲止運行的頁面。

來源

2016-02-19 Audrey Malone

不買人造區別：樹莓派了3" 畫面是臺式機和14「平板電腦可以成爲手機。不要運行某些東西，也不要運行某些東西，因爲它是「桌面」或「移動」設備，請查看代碼運行位置的屬性是否要求您運行不同的代碼。做功能檢測和視口檢查，然後根據它運行代碼，並且100％忽略人們稱之爲所使用的物理硬件的東西。 –

我會建議檢查用戶代理來測試它。 http://stackoverflow.com/questions/11381673/detecting-a-mobile-browser/11381730#11381730 –

*「我試過一個IF ELSE語句，告訴它只在窗口> 826時運行，但它只是導致整個腳本不能在任何大小的屏幕上運行。「* - 也許將代碼添加到您的問題中，因爲它聽起來像您有一個語法或邏輯錯誤，我們可以幫助。 – nnnnnn

在CSS文件：

/* Smartphones ----------- */ 
@media only screen and (max-width: 760px) { 
    #element { display: none; } 
}

在jQuery的/ javascript文件：

$(document).ready(function() {  
    var is_mobile = false; 

    if($('#element').css('display')=='none') { 
     is_mobile = true;  
    } 


    if (is_mobile == true) { 
     //Conditional script here 
    } 
});

來源

2016-02-19 22:53:27 dijaneee

如何獲取JavaScript在桌面上運行功能，但不是在移動設備上

回答

相關問題