美文网首页
单排文字滚动效果

单排文字滚动效果

作者: I_am_the_ZL | 来源:发表于2020-04-16 09:46 被阅读0次

    思路:一个大盒子包了几个小盒子,然后第一个小盒子需要往上移动,也就是margin-top: -30px;在这里需要把大盒子的高度设置成和小盒子高度一样,并且设置overflow:hidden;如果第一个盒子往上移动后,就把它添加到大盒子的末尾,并且margin-top:0px;这样第一个就变成了最后一个,第二个就变成了第一个,然后无限重复执行就实现了。

    大盒子包小盒子,并且每个小盒子的大小都是一样的 主要利用了第一个元素的操作和this

    感受:一个案例是否能看懂,我觉得关于你是否认识所有的代码是干什么的和他们连起来能干啥,我是这样理解的,毕竟代码都读懂了,只需要一步一步去理解,如果还会组合代码的用法,那就可以更快的去理解了。

    相关文章

      网友评论

          本文标题:单排文字滚动效果

          本文链接:https://www.haomeiwen.com/subject/irchvhtx.html