只在移動設備上隱藏div

我有一個按鈕，用作「複製網址」按鈕。這在沒有移動設備上工作正常，但是我相信你不能在移動設備上擁有這樣的功能，因爲它們依賴於閃存。在大多數移動網站上，用戶必須手動複製網址。只在移動設備上隱藏div

所以，我想刪除我的'複製網址'按鈕，一旦檢測到移動設備。

你烤了我之前，是我讀過：

我試圖在線程中提到的解決方案，但是它不工作。任何想法爲什麼？這裏是我的codepen：

<head> 
<script> 
    var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase())); 
    $('.test').css('display', 'none'); 
</script> 

</head> 
<div class= "test">yo test me</div>

大加讚賞。

來源

2015-04-15 rjtkoh

你必須把你的''

你看到的，這是因爲DOM沒有完全建成，所以當你試圖使用$('.test')訪問它的原因，它不能獲得它。你必須等到它完全準備好。

裹在由jQuery提供的現成功能，你的JavaScript代碼：

$(document).ready(function() { 
    // your code goes here 
});

一旦所有的DOM已加載此代碼纔會執行。看看documentation。

來源

2015-04-15 16:51:50 Paco

一個簡單的方法來做到這一點，只是在匹配某些情況時將類添加到html元素。

而且上課的時候存在

這允許您隱藏元素連<body></body>沒有actully加載使用選擇隱藏你想你只隱藏的元素。

此外，它需要最少的DOM操作。因此，當需要隱藏太多元素時，它不會滯後頁面。

只要把在<head></head>

<script> 
    if (navigator.userAgent.search("Some thing") >= 0) { 
     /*the html element*/ 
     var root = document.documentElement; 
     root.setAttribute("class", "hide-for-compitibility"); 
    } 
    </script> 
    <style> 
    html.hide-for-compitibility .selectors{ 
     display : none; 
    } 
    </style>

來源

2015-04-15 17:01:34 Jerry

代碼有沒有人看他的codepen？嘿傢伙，

您在使用它時沒有包含Jquery。把這個HTML代碼段<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
你把你的腳本在錯誤的部分，將它移動到JS部分。
你獲得的mobile變量應在IF語句中使用。例如，

if (mobile) $('.test').css('display', 'none'); else $('.test').html('This ELSE leg should be removed');

最後，讓你應該換一個$(document).ready()函數內部代碼其他答案的意見。

下面是一個例子，它做的工作。 http://codepen.io/anon/pen/QweBgq

不使用JavaScript的另一種方法是使用CSS。在CSS部分嘗試下面的代碼。

.test { display: none; } @media (min-width: 768px) { .test{ width: 200px; height: 50px; background: red; display: block; } }

來源

2015-04-15 17:29:52 Han

相關問題