刪除手機翻轉狀態？

我目前正在使用HTML/CSS觸發圖像的翻轉狀態。當圖像懸停時，會出現此翻轉狀態，而且還會在父div中翻轉相鄰文本時出現翻轉狀態。刪除手機翻轉狀態？

但是，在移動設備上（網站是響應式的），點擊/點擊圖像將啓用此翻轉狀態，並且需要第二次點擊/點擊才能使鏈接正常工作。

如何阻止這種情況發生？

下面是HTML：

<div class="four columns post alpha"> 
      <div class="thumbnail"> 
       <div class="image"> 
       <a href="banjee.html"><img class="scale-with-grid" src="images/thumb_banjee.jpg"> 
       <img class="scale-with-grid hoverimage" src="images/thumb_overlay.png"></a> 
       </div> 
       <a href="banjee.html"><h3>Banjee</h3></a> 


      </div>

這裏是相應的CSS：

.hoverimage { 
    position: absolute; 
    top: 0; 
    left: 0; 
    display: none; 
} 

.thumbnail:hover .hoverimage, 
.image:hover .hoverimage { 
    display: block; 
    cursor: pointer; 
}

來源

2013-08-19 Jacob Taylor

讓使用Javascript代碼從PC瀏覽時，此CSS樣式條件：

if(!(/android|webos|iphone|ipad|ipod|blackberry/i.test(navigator.userAgent.toLowerCase()))){ 
$(".hoverimage").css({'position':'absolute','top':0,'left':0,'display':'none'}); 
$(".thumbnail:hover .hoverimage, .image:hover .hoverimage").css({'display':'block','cursor':'pointer'}); 
}

來源

2013-08-19 04:32:24 MaveRick

刪除手機翻轉狀態？

回答

相關問題