light

gryng02

2010-07-24 22:05:53

License: MIT License

Fork: 32

Fav: 6

View: 17928

Play
Stop
Reload

Fullscreen

Smart Phone

Fork tree

Readme
JavaScript 85 lines
HTML 2 lines
CSS 42 lines

light
jQuery v1.4.2

function sizing(){
  $("#canv").attr({height:$("#wrapper").height()});
  $("#canv").attr({width:$("#wrapper").width()});
}

light

$(function () { sizing(); var hyperspace = new Hyperspace(); hyperspace.draw(); $("#canv").fadeIn('fast'); $(window).resize(function() { sizing(); hyperspace.draw(); }); }); function sizing(){ $("#canv").attr({height:$("#wrapper").height()}); $("#canv").attr({width:$("#wrapper").width()}); } var Hyperspace = function(){ var canvas = document.getElementById('canv'); var ctx = canvas.getContext('2d'); //background ctx.fillRect(0, 0, canvas.width, canvas.height); var star = new Array(10); for( i=0; i<star.length; i++ ){ star[i] = new Array(7); star[i][0] = Math.random()*canvas.width; // x star[i][1] = Math.random()*canvas.height; // y star[i][2] = Math.random()*canvas.width/3 + canvas.width/6; // r star[i][3] = Math.random()*0.05 + 0.2; star[i][7] = true; var r = Math.random()*255; // R var g = Math.random()*255; // G var b = Math.random()*255; // B r = Math.ceil(r); g = Math.ceil(g); b = Math.ceil(b); star[i][4] = r; //r star[i][5] = g; //g star[i][6] = b; //b } //draw ------------------------------------- var draw = function draw(){ //reset ctx.globalCompositeOperation = "source-over"; //ctx.fillStyle = "rgba(255, 255, 255, 1)"; ctx.fillStyle = "rgba(0, 0, 0, 1)"; ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.globalCompositeOperation = "lighter"; //point for(i=0; i<star.length; i++){ ctx.beginPath(); var edgecolor1 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.93)"; var edgecolor2 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.6)"; var edgecolor3 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.1)"; var edgecolor4 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0)"; var gradblur = ctx.createRadialGradient(star[i][0], star[i][1], 0, star[i][0], star[i][1], star[i][2]); gradblur.addColorStop(0,edgecolor1); gradblur.addColorStop(0.4,edgecolor1); gradblur.addColorStop(0.7,edgecolor2); gradblur.addColorStop(0.9,edgecolor3); gradblur.addColorStop(1,edgecolor4); ctx.fillStyle = gradblur; ctx.arc(star[i][0], star[i][1], star[i][2], 0, Math.PI*2, false); ctx.fill(); } }; return ({'draw': draw}); }; <div id="wrapper"><canvas id='canv'></canvas></div> html{ min-height: 100%; overflow: auto; position:relative; z-index: 1; background: #000; } body{ min-height: 100%; margin: 0; padding: 0; overflow: auto; position: relative; z-index: 1; font-size: 13px; color: #000; font-family: sans-serif; line-height: 1.7; } body > #wrapper{ height: auto; overflow: auto; position: fixed; z-index: 1; } #wrapper{ width: 100%; height:100%; min-height:100%; position: fixed; z-index: 1; } canvas{ display: none; z-index: 1; position: fixed; }

Play on jsdo.it games
Share
Embed
QR
Tag
Download

Complete!

Description どんなゲームですか？

Control Device

	スマートフォンコントローラー jsdo.it WebSocket Controller»
	マウス
	キーボード
	タッチデバイス

Fullscreen

有効
無効

jsdo.it games から削除する Submit

http://jsdo.it/gryng02/rNxn light
Tweet

style

Design view
Code view

code

<script type="text/javascript" src="http://jsdo.it/blogparts/rNxn/js?view=design"></script><p class="ttlBpJsdoit" style="width: 465px; margin: 0; text-align: right; font-size: 11px;"><a href="http://jsdo.it/gryng02/rNxn" title="light">light - jsdo.it - share JavaScript, HTML5 and CSS</a></p>

QR Code