html – 在点击时切换背景颜色和过渡

前端之家收集整理的这篇文章主要介绍了html – 在点击时切换背景颜色和过渡前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这似乎应该很容易,但我真的找不到办法.

animation http://doir.ir/css.gif

我需要改变&单击这些相应链接时转换页面的背景颜色.我见过的最接近这种转变的事情就是这样:

changing body background color using only html5 and css3
demo

这是非常接近的,但这仅在鼠标悬停在链接上时才有效.我已经尝试将伪选择器替换为:悬停到可以想象的所有东西,但是在点击链接后没有任何东西“粘住”.

基本上,我有一个链接列表,当你点击任何链接时,它会播放不同的歌曲(通过html5).我希望背景转换 – 根据当前播放的歌曲而改变.如果必要,我可以使用javascript或jquery.任何建议?

解决方法

这个怎么样? http://jsfiddle.net/u6PPn/2/

关键部分是jQuery:

$(".color").click(function() {
    var color = $(this).text();
    $("body").animate({ backgroundColor:color},1000);
});

HTML:

<div class="color">Red</div>
<div class="color">Green</div>
<div class="color">Blue</div>

这样你就可以设置n种颜色.

猜你在找的HTML相关文章