需要有关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，请使用具有Alpha透明度的PNG背景图像，并使用jQuery animate()代替CSS动画。