<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
input{ font-size:16px; height:26px;}
.btns input{ width:42px; margin:5px 0; padding:0px;}
</style>
</head>
<body style="background:#22222;">
<div id="mf" style="margin:120px auto 80px;"></div>
<div id="btns" class="btns" style="margin:50px auto 20px; width:300px;">
<input type="button" value="u"/>
<input type="button" value="d"/>
<input type="button" value="l"/>
<input type="button" value="r"/>
<input type="button" value="f"/>
<input type="button" value="b"/>
<input type="button" value="u'"/>
<input type="button" value="d'"/>
<input type="button" value="l'"/>
<input type="button" value="r'"/>
<input type="button" value="f'"/>
<input type="button" value="b'"/>
</div>
<div class="cs" id="cs" style="width:300px; margin:0 auto;">
<input type="button" value="重置颜色"/>
<input type="button" value="重置位置"/>
<input type="button" value="随机打乱"/>
<input type="text" style="margin-top:10px;" value="uu'bb'lr'f">
<input type="button" style="margin-top:10px" value="批量操作"/>
</div>
<script type="text/javascript" src="Cube.js"></script>
<script type="text/javascript">
var cube=new Cube('mf',{borderLength:200});
var aInt=document.getElementById('btns').getElementsByTagName('input');
for(var i=0;i<aInt.length;i++){
aInt[i].onclick=function(){
cube.turn3(this.value);
}
}
var aInt2=document.getElementById('cs').getElementsByTagName('input');
aInt2[0].onclick=function(){
cube.initColor();
};
aInt2[1].onclick=function(){
cube.initL();
};
aInt2[2].onclick=function(){
cube.random();
};
aInt2[4].onclick=function(){
var value=aInt2[3].value;
cube.turn3s(value);
};
</script>
</body>
</html>