jquery動畫未在手機上初始化

我正在通過使用jQuery懸停功能更改類的不透明度。注：我沒有使用jquery動畫未在手機上初始化

<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"> 
</script>

這裏是我的代碼：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(".thumbnail_image_related_project .transparent_font").css({'opacity' : '0'}); 
     $(".thumbnail_image_related_project").hover(
      function(){ 
       $(this).children(".transparent_font").stop().animate({'opacity' : '0.7'}, 300); 
      }, 
      function(){ 
       $(this).children(".transparent_font").stop().animate({'opacity' : '0'}, 300); 
      } 
     ); 
    }); 
</script>

此代碼是在筆記本電腦上正常使用，但不能在智能手機上。問題：當我點擊元素時，動畫正在運行，我將轉到下一頁。但是，當我回到上一頁時，元素的不透明度未初始化。有人知道爲什麼嗎？

這裏是我的PHP代碼：

<a href="http://192.168.0.11/next-page/" title="blabla"> 
    <div class="thumbnail_image_related_project"> 
     <h2 class="transparent_font">Text and the white background</h2> 
     <div id="image"> 
     <img width="300" height="173" src="http://192.168.0.11/blabla.jpg"/> 
     </div> 
    </div> 
</a>

這裏是我的CSS：

.thumbnail_image_related_project .transparent_font{ 
    line-height: 1.25em; 
    position: absolute; 
    top: 0; 
    left: 0; 
    color: black; 
    background-color:white; 
    width: 100%; 
    height: 100%; 
    opacity:0; 
}

來源

2013-02-13 Romain

您是否嘗試在觸摸界面中使用懸停？ – 2013-02-13 17:43:46

我不認爲它目前可能。 – Jai 2013-02-13 17:57:43

@Romain如何觸發觸摸屏上的懸停？ – Archer 2013-02-13 17:58:01

你使用jQuery或jQuery Mobile的？我問的原因是，在移動設備上，這可能是一個不起眼的事件。 jQuery Mobile可能會將touchstart轉換爲懸停。

看一看這個：jQuery hover event on tag on mobile devices。

來源

2013-02-13 17:44:19 Cymen

我不認爲你可以同時使用兩者。我已經用鏈接更新了我的答案。 – Cymen 2013-02-13 17:48:31

jquery動畫未在手機上初始化

回答

相關問題