向上滑動元件上懸停

看看http://www.shopvcf.com/blog/?page_id=56 向上滑動元件上懸停

我需要的區域用紅色心臟向上滑動我已經與此代碼完成。

$(document).ready(function() { 
    $('div.bottomwrap').on({ 
     'mouseenter': function() { 
      $(this).animate({ 
       bottom: 20 
      }); 
     }, 
     'mouseleave': function() { 
      $(this).animate({ 
       bottom: 0 
      }); 
     } 
    }); 
});

問題是我想在進入包含內容的盒子時滑動，而不僅僅是底部包裝。

我也想隱藏在同一時間，這將在後臺顯示圖像。

任何幫助將是偉大的。謝謝！

來源

2012-07-17 user1525766

他發佈了他已經試過的東西。 – 2012-07-17 17:50:16

嘗試將事件添加到整個框中，而不僅僅是'bottomwrap'。 – 2012-07-17 17:50:41

我注意到您的網頁存在問題。你有多個ID爲'postwrap'的元素。不要這樣做。 ID應該是獨一無二的，讓它成爲一個班級。 – 2012-07-17 17:52:59

你需要做的一件事就是將動畫的隊列設置爲false並設置持續時間。否則，如果用戶快速地來回移動屏幕，每個事物都會繼續移動。

退房更多的細節，但它看起來像這樣：

至於你的問題。我會首先更改ID的所有設置「jpgoverlay」 - 將其設置爲類名 - 如果有選項。然後下面的代碼應該做的伎倆。擁有一個非唯一名稱的ID可能會在稍後導致一些痛苦。

$(document).ready (function() { 
    $('div.jpgoverlay').on({ 
     'mouseenter': function() { 
     $(this).animate({ bottom: 20 },{queue:false,duration:400}); 
    }, 
    'mouseleave': function() { 
     $(this).animate({ bottom: 0 },{queue:false,duration:400}); 
    } 
    }); 
});

來源

2012-07-17 18:01:26 anAgent

向上滑動元件上懸停

回答

相關問題