Raphaelist_vol24 (background)
Raphael de SVG ! vol24
by nekosmash
HTML
<script type="text/javascript" src="http://dl.dropbox.com/u/63305355/raphael-min.js"></script>
<div id="canvas">
<div class="text">
GRADIENT
</div>
</div>
CSS
body,html
{
height:100%;
margin:0;
}
#canvas
{
height:99%;
background:#fff;
text-align:center;
}
.text{
letter-spacing: 20px;
color:#fff;
font-size:150%;
width:60%;
height:60%;
position:absolute;
left:20%;
top:40%;
z-index:1;
}
JavaScript
var paper;
var rect;
window.onload = function () {
paper = Raphael(0,0,"100%","100%");
draw();
paper.circle(0,0,100).attr({
stroke:"none",
fill:"rgba(255,255,255,.2)"});
};
window.onresize = function () {
rect.remove();
draw();
}
//背景描画
function draw(){
rect = paper.rect(0,0,
$(window).width(),
$(window).height()
).attr({fill:"45-#f00-#808"
,stroke:"none"
,opacity:1
});
rect.toBack();
}