Raphaelist_vol30(click)
Raphael de SVG ! vol30
by nekosmash
HTML
<script type="text/javascript" src="http://dl.dropbox.com/u/63305355/raphael-min.js"></script>
<div id="canvas">
<div class="text">
CLICK
<div id="result"></div>
</div>
</div>
CSS
body,html
{
height:100%;
margin:0;
}
#canvas
{
height:99%;
background:#ccc;
text-align:center;
}
.text{
letter-spacing: 20px;
color:#fff;
font-size:150%;
position:absolute;
width:"100%"
text-align:center;
top:40%;
z-index:1;
background:#000;
}
#result{
font-size:60%;
letter-spacing: 5px;
}
input{
padding:3px;
}
JavaScript
var rect;
var i=0;
window.onload = function(){
var paper = Raphael(0,0,"100%","100%");
rect = paper.rect(($(window).width()-100)/2,
($(window).height()-100)/2,100,100)
.attr({fill:"90-#804-#202-#305"});
rect.click(rect_clicked);
}
function rect_clicked(){
//削除する
switch(i){
case 0:
alert("クリックされちゃった////");
break;
case 1:
alert("ちょ!やめっ・・/////");
break;
case 2:
alert("おいちょっとカメラ止めろ");
i=0;
break;
}
i++;
}