为了账号安全,请及时绑定邮箱和手机立即绑定
首页 手记 【九月打卡】第14天...

【九月打卡】第14天 javascript(点击圆点切换图片2)

2022.09.18 15:46 53浏览

1.课程名称: 圆点切换2


课程章节:点击圆点切换图片2  javascript


2.课程内容:

我们把当前点击的span id 赋给index

     index = this.id

    

https://img2.sycdn.imooc.com/6326c55e000133ac10180785.jpg

还需要调用changeing方法,显示图片

https://img1.sycdn.imooc.com/6326c6bd0001feab10040704.jpg

点击第二个圆点跳到了第二张图片,但是圆点没有跳动

https://img1.sycdn.imooc.com/6326c707000150c418340813.jpg

我们需要在changeing方法做处理

先把所有span显示的清除掉

dots[i].classname = "";

https://img1.sycdn.imooc.com/6326ca030001875911210685.jpg

效果:全部消失了

https://img1.sycdn.imooc.com/6326ca34000135c609150473.jpg

然后用索引找到当前点击的span,显示及设为当前

dots[index].classname = "active"

https://img4.sycdn.imooc.com/6326cb39000182d014540749.jpg


效果:

https://img3.sycdn.imooc.com/6326cc730001bfeb16040826.jpg

https://img1.sycdn.imooc.com/6326cc8300019c2115030670.jpg

本小节完!!


三,本章重点,我觉得这是很考验我的逻辑O(∩_∩)O,完蛋咯得多练几遍



   

点击查看更多内容
0人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
全栈工程师
手记
粉丝
4
获赞与收藏
0

关注TA,一起探索更多经验知识

同主题相似文章浏览排行榜

风间影月说签约讲师

50篇手记,涉及Java、MySQL、Redis、Spring等方向

进入讨论

Tony Bai 说签约讲师

146篇手记,涉及Go、C、Java、Python等方向

进入讨论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消