切西瓜

欢迎来到HTML简单的切西瓜

一款简单的休闲游戏。目的只有一个——砍水果！屏幕上会不断跳出各种水果–西瓜，凤梨，猕猴桃，草莓，香蕉，苹果等等—在它们掉落之前要快速的全部砍掉！千万别砍到炸弹！不然就over了。还有时间模式没有炸弹，全凭你的技巧了！还有一定几率从屏幕左右侧弹出新奇水果很难切割！

首页

链接: link.

图片:
当然，我们为了让用户更加便捷，我们增加了图片拖拽功能。

部分代码

var buzz = require( "buzz" );
var supported = buzz.isSupported();

var config = { 
	formats: [ "ogg", "mp3" ], 
	preload: true, 
	autoload: true, 
	loop: false 
};

function ClassBuzz( src ){
    this.sound = new buzz.sound( src, config );
}

ClassBuzz.prototype.play = function( s ){
	s = this.sound;
	s.setPercent( 0 );
	s.setVolume( 100 );
	s.play();
};

ClassBuzz.prototype.stop = function(){
	this.sound.fadeOut( 1e3, function(){
	    this.pause();
	} );
};


exports.create = function( src ){
	if( !supported )
	    return unSupported;
	else
    	return new ClassBuzz( src );
}

function unSupported(){
	// TODO: 
}

unSupported.play =
unSupported.stop = function(){
	// TODO: 
};

html, body{
	width: 100%;
	height: 100%;
	background: #484848;
}

body{
	position: relative;
}

em{
	display: none;
}

#extra, #view{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 640px;
	height: 480px;
	margin: -280px auto auto -320px;
	text-align: left;
	background: #fff;
}

#view{
	display: block;
	background: transparent url(blank.gif) repeat 0 0;
	cursor: default;
	z-index: 20;
}

#extra{
	background: #000;
}

#extra .layer{
	position: absolute;
	left: 0;
	top: 0;
	width: 640px;
	height: 480px;
	z-index: 10;
}

#fork{
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	width: 356px;
	height: 92px;
	cursor: pointer;
	background-image: url(fork.gif);
	z-index: 0;
}

#desc{
	width: 100%;
	position: absolute;
	left: 0;
	top: 50%;
	height: 80px;
	color: #ccc;
	line-height: 40px;
	margin-top: 200px;
	text-align: center;
	font-size: 14px;
}

#desc a{
	color: #318fe1;
}

#browser{
	font-size: 14px;
	line-height: 16px;
}

#browser .b{
	color: #fff;
	font-weight: 700;
}

最终效果图

因为还不能发视频，所以分开发照片啦！！！

链接: link.