javascript方块,编程方块图

求javascript写一个方块或图片沿窗体做矩形运动的代码

用 jQuery 给你写了一个，保存成 html 文件用浏览器打开即可看到效果。

目前创新互联建站已为上千家的企业提供了网站建设、域名、虚拟主机、网站运营、企业网站设计、长安网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

如果 不能打开，自己下一个 jquery，然后修改一下路径。

html

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8"

title移动方块/title

style type="text/css"

html, body {

width: 100%;

height: 100%;

}

#box {

position: absolute;

width: 20px;

height: 20px;

background: #FF0;

border: 1px solid #F00;

}

#fig {

position: absolute;

top: 100px;

left: 100px;

width: 200px;

height: 200px;

background: #E4F2FF;

border: 1px solid #B1C6D9;

}

/style

script type="text/javascript" src=" "/script

script type="text/javascript"

$(document).ready(function() {

var $fig = $('#fig');

var $box = $('#box');

var P = $fig.position();

var M = 2;

var L = P.left - $box.width() - M;

var T = P.top - $box.height() - M;

var R = P.left + $fig.width() + M;

var B = P.top + $fig.height() + M;

var left = L;

var top = T;

$box.css('left', left);

$box.css('top', top);

var status = 0;

var STEP = 5;

setInterval(function() {

switch(status) {

case 0:

if(left R) {

left += STEP;

if(left R) left = R;

$box.css('left', left);

} else {

status = 1;

}

break;

case 1:

if(top B) {

top += STEP;

if(top B) top = B;

$box.css('top', top);

} else {

status = 2;

}

break;

case 2:

if(left L) {

left -= STEP;

if(left L) left = L;

$box.css('left', left);

} else {

status = 3;

}

break;

case 3:

if(top T) {

top -= STEP;

if(top T) top = T;

$box.css('top', top);

} else {

status = 0;

}

break;

default: break;

}

}, 100);

});

/script

/head

body

div id="box"/div

div id="fig"/div

/body

/html

js怎么让方块经过的地方留下痕迹

用js触发CSS3。

objstylewidth=400px时，就会有过渡段，出现过渡动画，出现痕迹。

当元素本身为display，none时，若此时我们想通过js先将其变为display：block并且随后再触发其他想要的transition过渡效果，需要在js改变其为display：block后延迟100ms左右的时间再去设置其他过渡动画，否则该过渡动画不会触发。

我想用 JavaScript实现 当鼠标 滑过方块时，通过添加active给li标签背景变白字便黑 我这样做怎么不行呢

你好，问题出现在你的第15行样式上；

应该这么写：

#tab ul li.active{background:white;color:#000;}

注意li.active之间没有空格。

希望能帮到你。