html CSS如何设置按钮点下之后改变当前按钮的背景色
发布网友
共2个回答
懂视网
回复讨论(解决方案)
用jquery可以实现
JQUERY可以实现，如果是火狐可以参考CSS3中的keyframes
你说的应该是动画
我知道的三种方式
1. IE
使用滤镜 filter:ahpha(opacity:value); value:可以是1,2,3....100
2.FF
opacity属性;opacity:value 可以是0,0.1,0.2....1
以上两种只是给图片添加了透明度 要想实现从无到有 或者 从有到无 你需要自己写一个函数
var value = 100;var oImg = document.getElementsByTagName("img")[0];oImg .opacityVlaue = 0;if(oImg .iTimer) clearInterval(oImg.iTimer);oImg.iTimer = setInterval(function(){ if(oImg .opacityVlaue < 100) { oImg .opacityVlaue += 10; oImg.style["filter"] = "alpha(opacity:"+oImg .opacityVlaue+")"; oImg.style["opacity"] = oImg .opacityVlaue/ 100; }else{ clearInterval(oImg.iTimer); oImg.iTimer = 0; oImg .opacityVlaue = 100; oImg.style["filter"] = "alpha(opacity:"+oImg .opacityVlaue+")"; oImg.style["opacity"] = oImg .opacityVlaue/ 100; }} , 30) 上面代码是从不透明到透明 反之亦然 改一些值就可以了
3.Chrome
最简单
css这样定义:
-webkit-transition-duration:.2s;
opacity:0;
你在JS里面控制opacity.比如改变了你上面定义CSS的对象的opacity:1;他就自动有了动画效果。left, top等都可以生效。
如有笔误处请指正。
热心网友
<input id="btn" type="button" value="点击按钮" />
<script language="javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script language="javascript">
$(function () {
$("#btn").hover(function () { $(this).css("background-color", "Yellow"); }, function () { $(this).css("background-color", "red"); });
$("#btn").click(function () {
$(this).css("background-color", "Gray");
});
});
</script>
