sofeien的专栏

飘动小球 form { background-color: yellow; } var ctx; var g=2; var balls=[]; function Ball(bx,by,rad,color){ this.bx = bx; this.by = by; this.rad

模拟一个下拉列表的效果 * { margin:0; padding:0; } div#nav { border:1px solid green; width:100px; height:20px; margin-left:1px; line-height:20px; padding-lef

需要排版的内容是一系列图片，图片右侧是一个删除按钮。需要图片右侧的按钮和图片垂直居中对齐。图片和按钮水平排列，填充一行后换行，换行时图片和对应的按钮不能上下分离。以下是一个实现方案：my web button { cursor:pointer; } ul { list-style:none; } li { display:inline-block; }

考验记忆力的翻牌小游戏，主要运用到 setTimeout ,在匹配失败后反转牌面。使用index参数记录翻开第一张牌的索引，与第二张翻开牌对比。 翻牌游戏 var ctx; var bkcolor = "rgb(211, 33, 204)"; var frontcolor = "rgb(31, 232, 131)";

MyWeb var ctx; var r=10; var x=200; var y=200; var tevent; var spx; var spy; function init() { ctx = document.getElementById("canvas").getContext("2d");

规则矩形 var ctx; var post1=[]; function getpos(){ var i; var j; for(i=10;i<500;i=i+100){ for(j=10;j<500;j=j+100){

射击小球 var rad=8; var ctx; var vx; var posy; var vy=10; var a=2; var x; var y; var n=0; var evt; var targetx; var targety; var speed=5; var cishu

规则矩形 var ctx; var bk = new Image(); bk.src = "background.png"; var post1=[]; var porks=[]; function pork(px,py){ this.px = px;

MyWebTest form { width: 500px; padding: 10px; margin: 10px; } input:valid {background-color: white;} //输入正确时背景色 input:invalid {background-color: red;}

鼠标事件 var ctx; var linew=10; var color="rgb(255,0,0)"; var isClick; var mx=50; var my=200; var tid; function setstyle(w,c){ ctx.lineWidth = w; ctx.s

DOM元素的宽高有多项属性值：.clientHeight .clientWidth   代表元素内部内容的可见宽高，不包括内边距，滚动条的宽高.scrollHeight .scrollWidth代表元素内部内容的实际宽高。可滚动最大距离与实际宽高和可见宽高的差值有关.offsetHeight .offsetWidth代表元素外侧包裹边框的宽高，包含滚动条的宽高