2010-10-08在浏览器中兼容+jQuery3

一．实现背景图片铺满（兼容各种浏览器）

<script type="text/javascript">

$(document).ready(function() {

$("body").ezBgResize({

img : "image/bg.jpg", //图片路径

opacity : 1,

center : true

});

});

</script>

二．使div实现半透明

子元素也透明：opacity：0.5

子元素不透明：background:rgba(0,0, 0, 0.4);

另：为了使其在较低版本也能显示，即实现浏览器的兼容性，可写为：

background:rgba(0,0, 0, 0.4)!important;
filter:Alpha(opacity=40);

[b] jQuery（3） [/b]

九.设置元素样式

1. 添加、删除CSS类别

$("div").addClass("myClass1 myclass2") //如果两个样式设置了相同的属性，以后面的（myClass2）属性值为准.

$("div").removeClass("myClass1") //移除样式

2.样式交替执行

1.$(function(){

$("#btn").click(function({

$(this).toggleClass(“d2”); //点击时不断切换

}););

});

注意：toggleClass只能设置一种Class不能设置多个

2. $(".d1").toggle(1000) //点击之后，显示和隐藏交替执行，设置时间1秒

3. $(".d1").toggle(function(){ //点击之后，交替执行，只支持版本比较低的jQuery类库文件

$(".d1").hide(1000);

},function(){

$(".d1").show(1000);

});

3.直接获取、设置样式

mouseover：鼠标移上去之后

mouseout： 鼠标移走之后

$(".d1").mouseover(function(){

$(this).css(“color”,”red”);
});

$(".di").mouseout(function(){

$(this).hide(1000);

});

也可以是两种样式合在一起：

$(".d1").hover(function(){

$(".d1").hide(1000);     //鼠标移上去之后，一秒内隐藏

},function(){

$(".di").show(1000);    //鼠标移走之后，一秒内显示

})