jQuery页面淡入淡出效果
开始jQuey的学习，做个小的页面淡入淡出效果玩玩。发现jQuery真的满有意思，哈哈。
最终效果看这里：http://wbell.cn/
废话不多说，上代码：
$(document).ready(function(){
//页面淡入淡出
$("body").css("display","none");
$("body").fadeIn("slow");
$("a[target],a[href*='javascript'],a.lightbox-processed,a[href*='#']").addClass("speciallinks");
$("a:not(.speciallinks)").click(function(){
$("body").fadeOut("slow");
$("object,embed").css("visibility","hidden");
});
});
//页面淡入淡出
$("body").css("display","none");
$("body").fadeIn("slow");
$("a[target],a[href*='javascript'],a.lightbox-processed,a[href*='#']").addClass("speciallinks");
$("a:not(.speciallinks)").click(function(){
$("body").fadeOut("slow");
$("object,embed").css("visibility","hidden");
});
});
备注：$("a[target],a[href*='javascript'],a.lightbox-processed,a[href*='#']").addClass("speciallinks"); 这句是为了防止没有跳转的页面内链接（包括有target属性的链接，js的链接，lightbox的链接，和页面内链接#）在被点击时也淡出，那样什么都看不见了;)，找出来给它们加个“speciallinks”的class，然后用$("a:not(.speciallinks)")来选择没有此class的所有链接。
另外：页面内的flash不会被fadeout，我把它用$("object,embed").css("visibility","hidden");直接隐藏掉。
但是，ie下的效果确很糟糕，有背景图的元素并不会fadeT_T。换一个思路，我在最上面覆盖一个背景色为白色的div来实现，具体代码如下：
$(document).ready(function(){
//页面淡入淡出
$("body").append("<div id=\"mask\" style=\"background-color:white;width:100%;height:90000px;position:absolute;z-index:9999;top:0;left:0;\"></div>");
$("#mask").fadeOut("slow");
$("a[target],a[href*='javascript'],a.lightbox-processed,a[href*='#']").addClass("speciallinks");
$("a:not(.speciallinks)").click(function(){
$("#mask").fadeIn(1000);
$("object,embed").css("visibility","hidden");
});
});
//页面淡入淡出
$("body").append("<div id=\"mask\" style=\"background-color:white;width:100%;height:90000px;position:absolute;z-index:9999;top:0;left:0;\"></div>");
$("#mask").fadeOut("slow");
$("a[target],a[href*='javascript'],a.lightbox-processed,a[href*='#']").addClass("speciallinks");
$("a:not(.speciallinks)").click(function(){
$("#mask").fadeIn(1000);
$("object,embed").css("visibility","hidden");
});
});
恩，看起来好像还可以，先就这样吧:)
不错的，很绚丽啊，收藏了 石家庄制冰厂
不错的，很绚丽啊，收藏了
石家庄制冰厂
其实并不是很推荐这种做法，因为body级别的opacity
其实并不是很推荐这种做法，因为body级别的opacity渲染是比较占浏览器资源的．
哇，
哇， Evance老大，哈哈。
恩，所以我下面改成了用一个mask:)
发表新评论