爲什麼我的Pin It按鈕在滾動時「滾動/翻轉」？

Question

參考當前頁例如：http://blog.froy.com/bond-street-loft-by-axis-mundi/

懸停在任何Pin它按鈕，無論圖像或在後的底部，使所述按鈕可以「滾動/翻轉」，而不是示出的靜態Pin它的按鈕圖像。

我什至不能確定是什麼原因......有沒有人有這方面的經驗？這發生在Chrome和Firefox中。網站正在運行Wordpress。

Answer 1

它看起來就是按鈕設置的方式。如果您訪問this網站，則會看到這是該按鈕的託管位置。你會注意到它看起來像三個不同的按鈕。這意味着它是一個精靈，並通過鼠標的某些活動，它顯示了圖像的不同部分。只需通過採取快看，我發現這個

media="all" 
a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea { 
-webkit-transition: all 0.1s ease-in-out; 
-moz-transition: all 0.1s ease-in-out; 
-ms-transition: all 0.1s ease-in-out; 
-o-transition: all 0.1s ease-in-out; 
transition: all 0.1s ease-in-out; 
} 

你會在代碼注意到有轉變，這是什麼使效果發生的一部分。這也是僅顯示特定圖像的代碼的一部分，請注意背景位置。

a.PIN_1392869101137_pin_it_button_20 { 
background-repeat: none!important; 
background-size: 40px 60px!important; 
height: 20px!important; 
margin: 0!important; 
padding: 0!important; 
vertical-align: baseline!important; 
text-decoration: none!important; 
width: 40px!important; 
background-position: 0 -20px; 
} 

現在在：懸停通知的背景位置是。

a.PIN_1392869101137_pin_it_button_20:hover { 
background-position: 0 0px; 
} 

該變化是什麼導致的影響。