⑴ 如何使用js的计时器来让一个div背景从左向右移动全部代码
你好，给你写了一个很基础的例子。参照着自己优化成你想要的效果吧。
示例是这样的，鼠标移动到div上，背景图片会从左往右移动直至最右端。鼠标移出div，背景图标从右往左直至最左端。
备注：考虑到宽度变化，本例背景图片使用百分比定位。根据你的实际情况也可改为使用像素(px)定位。
<style>
.bg-div{
height:110px;
background:url(https://gss0.bdstatic.com/7Ls0a8Sm1A5BphGlnYG/sys/portrait/item/27267a776a746b7505.jpg)0%centerno-repeat#ccc;
}
</style>
<divid="J_BgDiv"class="bg-div"></div>
<script>
(function(){
vardiv=document.getElementById('J_BgDiv');
//背景百分比（从左至右，0%-100%）
varpos=0;
//背景向右移还是向左移（0：向右，1：向左）
vardir=0;
//每次移动的百分比，控制速度
varstep=3;
div.addEventListener('mouseover',function(){
varnode=div;
dir=0;
if(!div.mover){
div.mover=setInterval(function(){
//每次移动10%
if(dir===0){
pos+=step;
}else{
pos-=step;
}
pos=pos>=100?100:pos;
pos=pos<=0?0:pos;
node.style.backgroundPosition=pos+'%center';
},20);
}
},false);
div.addEventListener('mouseout',function(){
dir=1;
},false);
})();
</script>
希望能帮你解决问题，如有疑问可以追问。
⑵ JS脚本如何实现DIV的移动
给div的omousedown指定匿名函数获取当前的鼠标坐标
然后在onmouseover中获取实时的鼠标坐标 根据div的属性动回态的设置width height top left 等属答性
onmouseup 释放即可
⑶ js,控制一个div向左右匀速移动循环
这个不来需要js， 直接使源用css就行，给你一个简单的demo，有不懂的可以问我：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
body{height: 100%; position: relative;}
.demo{position: absolute; width: 80%; height: 200px; background: #2aa198;animation: move 1s linear infinite alternate;}
@keyframes move {
from{left: 0}
to{left: 10%}
}
</style>
</head>
<body>
<div class="demo"></div>
</body>
</html>
⑷ js实现div自动在窗口左右移动
<!DOCTYPEHTML>
<html>
<head>
<metacharset=utf-8/>
<title>UFO来了</title>
<script>
window.onload=function(){
vari=10;
varj=0;
vare=target;
varwin=document.documentElement||.body;
functionintern(){
varwidth=e.clientWidth;
varheight=e.clientHeight;
varleft=parseFloat(e.style.left);
vartop=parseFloat(e.style.top);
varwindowWidth=win.clientWidth;
varwindowHeight=win.clientHeight;
if(windowWidth-width<(left+i)){
i=-i;
}elseif((left+i)<0){
i=-i;
}
if(windowHeight-height<(top+j)){
j=-j;
}elseif((top+j)<0){
j=-j;
}
e.style.left=left+i+"px";
e.style.top=top+j+"px";
}
setInterval(intern,30);
};
</script>
</head>
<body>
<divid="target"style="border-radius:90px;background-color:red;width:30px;height:30px;position:absolute;top:100px;left:0px;"></div>
</body>
</html>
⑸ 怎么样实现一个div左右翻转180度 用JavaScript和css
看给你的参考资料哈
翻转指定角度
IE用matrix
现代浏览器用transform
如果需要动画效果的话
IE用定时器来做
现代浏览器用transition就行
⑹ JS让div左右来回滚动，到达页面右端时，从右端回到左端，然后到达左端时，从左端到达右端
在你原来的代码上进行了修改，加粗倾斜的部分是添加或者修改的位置
<script>
var timer1 = null;
var el = null;
var left = 1;
function moveItRight() {
if (parseInt(el.style.left) > (screen.width - 50)) //el.style.left = 0;
{
left = -1;
}
else if (parseInt(el.style.left) <= 0) {
left = 1;
}
el.style.left = parseInt(el.style.left) + 2 * left + 'px';//本题目最关键的一句代码，让el对象的左边距每次循环都增加2像素，也就是向右移动了2像素
timer1 = setTimeout(moveItRight, 25);//隔25毫秒后运行一次moveItRight函数
}
window.onload = function () {
el = document.getElementById("div1");
el.style.left = '500px';
moveItRight();
}
</script>
⑺ js怎么实现div左右滚动效果
js做动画需要自己做for循环动作 大致就是累加某个样式参数 例如left值 再判断是否等于设定值 如果支持css3建议使用css3动画去做