使用jQuery圖片標題需要諮詢

Question

http://www.zurb.com/expo

我一直在尋找正是爲了說明這樣的年齡。但我想要說明該標題背景的不透明性。 50％，然後懸停90％和半脈動文字效果。你能幫助我嗎？

Answer 1

根據您的瀏覽器支持，這可能是accomplished using CSS animations (example)。

h2 { 
    background: rgba(0, 0, 0, 0.5); 
} 

.image:hover h2 { 
    background: rgba(0, 0, 0, 0.8); 
    -moz-animation: 2s ease 0s normal none infinite pulse; 
    -webkit-animation: 2s ease 0s normal none infinite pulse; 
} 

@-moz-keyframes pulse { 
    0% { color: #000 } 
    50% { color: #FFF } 
    100% { color: #000; } 
} 

@-webkit-keyframes pulse { 
    0% { color: #000 } 
    50% { color: #FFF } 
    100% { color: #000; } 
} 

如果需要舊的瀏覽器的支持，而不是RGBA的，使用PNG的背景圖像與Alpha透明度，並jQuery animate()而不是CSS動畫。