几年前给自己的博客写的装X用的。。。哈哈哈。。。
$(function(){ $('body').append(' '); var _bg = $("._bg"); //背景 var _font_size = 300; //最大字体 var _fade = 0.5; //内容透明度 var _color = ''; //内容颜色 留空则随机 //设置背景高度 _bg.height($(window).height()); //$('body').height(),$(window).height(),500 //给背景添加内容 在这里自定义内容 var _content = 'ABVTDFGWSQ'; _bg.html(_content); _bg.children().each(function(){ //随机背景内容的 大小 位置 旋转 $(this).css({ 'position':'absolute', '-webkit-transform':"rotate("+Math.ceil(Math.random()*360)+"deg)", '-moz-transform':"rotate("+Math.ceil(Math.random()*360)+"deg)", '-ms-transform':"rotate("+Math.ceil(Math.random()*360)+"deg)", 'font-size':Math.ceil(Math.random()*_font_size)+'px', 'top':Math.ceil(Math.random()*_bg.height())+'px', 'left':Math.ceil(Math.random()*_bg.width())+'px' }); if(_color){ $(this).css('color',_color); }else{ $(this).css('color','#'+Math.ceil(Math.random()*1000000)); } $(this).fadeTo(0,Math.random()); }); //设置整体透明度 _bg.fadeTo(0,_fade);});
由于使用了css3的旋转属性 ,一些低版本浏览器可能效果不太一样。。。
记得加载jquery包。。。