当前位置:首页 > 日记 > 正文

带有白色旋转木马图形的本地js示例

带有白色旋转木马图形的本地js示例
现在就让我们来看看js的本地旋转木马,再加上小圆点可以一起移动!

CSS代码:
* {
保证金:0px;
填料:0px;
}
UL {
宽度:2500px;
身高:300px;
位置:绝对;
}
李{
浮点数:左;
列表样式:无;
}
img {
宽度:500px;
身高:300px;
}
div {
宽度:500px;
身高:300px;
保证金:50px汽车;
职位:相对;
溢出:隐藏;

}

白色
# round_ul {
宽度:300px;
身高:30px;
背景:黄色;
职位:相对;
保证金:250px汽车;

}

# round_ul李{
宽度:20px;
身高:20px;
边框半径:50%;
背景:# 2196f3;
左:50px保证金;
光标:指针;

}
HTML代码:


js的一部分:
执行代码页加载完成。
在window.onload =函数(){
获取
无功imgul = document.getelementsbytagname(UL){ 0 };
无功groundul = document.getelementbyid(round_ul );

第一个白色红色/红色的子节点(不是空节点)
groundul。孩子{ 0 }。style.backgroundcolor =红色;

var,x=0;
启动定时器功能

函数FN(){
SID = setInterval(ABC,10);
}
函数abc(){

/ /每10秒修改UL坐标,修改1px
imgul.style.left = X +PX;
如果图片完全进入div
如果(x % = 500 = 0){
修改函数调用/白色
如果(x = 2000){
x=0;
imgul.style.left = 0 +PX;
}
昌黎(Math.abs(X / 500)); / /改性白方法调用
ClearInterval(SID); / /临时计时器
setTimeout(fn,1000); / /每100毫秒第二定时器

}
}
(FN);
修改/白方法
函数昌黎(数字){
白色遍历阵列
对于(var x=0;x<4;x + +){

所有的点都变成了蓝色
groundul。孩子{X}。style.backgroundcolor =# 2196f3 ;
}
相应的改性白色红色
groundul。孩子{民}。style.backgroundcolor =红色;
}
}
这是它uff01 uff01do你懂吗

以上js与本机白色旋转木马图的例子都是小分享给大家,希望能给大家一个参考,希望大家支持。

相关文章

如何设置2013版PPT

如何设置2013版PPT

如何设置,电脑软件,PPT,完成PPT幻灯片页面设置后(参考:PowerPoint 2013页),用户可以在打印之前预览打印效果,打印或进一步设置。下面分享ppt2013如何设置打印,欢迎学习。 对于ppt2013设置打印的步骤如下: 打开我们需要打印的PPT幻灯片,然后单击页…

解决oracle批量修改问题

解决oracle批量修改问题

批量修改,电脑软件,oracle,问题:根据唯一的字段代码修改其他字段,修改部分数据,数字在数以万计的数据中,数据是大的,并且卡片在开始时是死的!愚蠢的方式,改变了一个不知道可以一年。其他方式的个人原因是真的无能为力: 更新ka02_new集aka065 = 1,aka…

PS如何设置画布尺寸PS画布尺寸设置

PS如何设置画布尺寸PS画布尺寸设置

方法,设置,尺寸,如何设置,电脑软件,当有人使用ps时,它可能太小或不够,或者像素不太低,等等。事实上,有一种方法可以改变这种现象。下面是这个方法的过程。我希望你能喜欢它。 步: 1。首先打开ps,然后查看上面的文件。 2, 打开文件后,单击New 三.…

设置在word2013线间距的两种方式

设置在word2013线间距的两种方式

设置,两种,间距,方式,电脑软件,在word2013文档,行距是指行与行之间的距离的Word文档。用户可以设置行距在word2013文件为一个固定值(如15磅),或多个当前行的高度。然后下面是一点给你分享在未来word2013设置间距的技术编辑,希望对你有帮助。 在…

画家如何给手绘漫画画家一本手绘漫

画家如何给手绘漫画画家一本手绘漫

漫画书,手绘,画家,一本,漫画,摘要:画家手绘漫画完整教程 1、色彩原则 在着色时可以确定图片的深度。画家有33种笔刷,各种变化都能达到400以上。 在画线漫画时,可以考虑用PS做线稿,用灰色把整幅画展开,以加深和加深后期的色彩。 2。关于黑暗的…

如何升级旧笔记本玩魔兽世界游戏

如何升级旧笔记本玩魔兽世界游戏

升级,魔兽世界,游戏,电脑软件,问题: 我用的是ThinkPad T400笔记本,旧的型号,配置低,如何升级,可以畅玩魔兽世界:Delano King 的游戏。 答案uff1a ThinkPad T400笔记本电脑的硬件配置,真的需要升级到魔兽世界运行平稳:Delano王,内存升级到4G至少。…

javascript运动框架解决了防抖动问题。

javascript运动框架解决了防抖动问题。

运动,框架,解决了,防抖动,电脑软件,本文的应用是Javascript运动框架(1)的应用。 ScrollTop:有时一个网页很长,其高度大于显示高度,和它产生的滚动。然后,在高高的方向,卷的部分scrollTop。 VaR scrollTop = document.documentelement.scrolltop docume…

PS是怎样产生高光效果的

PS是怎样产生高光效果的

的是,效果,是怎样,电脑软件,PS,本教程介绍了一种很好的制作高光的方法,其制作过程不是很复杂。它需要使用钢笔工具来绘制高亮部分的选择并缓慢渲染。效果看起来很自然。让我们学习萧边。 PS是怎样产生高光效果的 2下面,对于所有分解,这个高光…

右下角的改变、覆盖区域信息的方法

右下角的改变、覆盖区域信息的方法

方法,覆盖,区域,方案,右下角,问题: 学习、网络存储系统,想在网页的右下角的更改;京东商城覆盖区、县找不到修改的地方。 答案uff1a 最后,打开主题 / / index.dwt ecmoban_jingdong在网站的根目录,找到要修改的help.lbi文件。 所以你要进入后…

5种解决Ajax缓存方法的总结(推荐)

5种解决Ajax缓存方法的总结(推荐)

缓存,推荐,方法,电脑软件,Ajax,1、添加anyajaxobj.setrequestheader(如果修改以来,0)在发送请求阿贾克斯。 2、添加anyajaxobj.setrequestheader(缓存控制,无缓存)在发送请求阿贾克斯。 3、通过URL添加随机数:新鲜= + Math.random(); 4、添加URL后…

如何让赢10开放比锁屏界面更快(溶液

如何让赢10开放比锁屏界面更快(溶液

锁屏,界面,更快,溶液,电脑软件,问题: 计算机系统升级赢10,每次你打开电脑,是显示锁屏前,鼠标点击查看登录界面,如何多此一举,跳过锁屏,直接显示登录界面 答案uff1a 你可以使用Win+R组合键快速打开运行,输入命令,盒,gpedit.msc,进入车内,打开本地组策…