为了账号安全，请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
获取体验码
编程练习，商城分类导航效果教程-慕课网
章节
课签
笔记
占位
占位

编程练习

小伙伴们，请为导航添加鼠标移开效果

效果图:

温馨提示:完成任务后，请验证是否与实践描述效果一致，如一致，恭喜您，你已经掌握此技能。

任务

在编辑器的第206行处，使用JS代码，循环设置li标签的鼠标的移入和移开效果

提示：指定li标签onmouseover和onmouseout函数，设置移入时样式为lihover,设置移开时样式为空即可。

?不会了怎么办

参考代码:

 <script type="text/javascript">

        window.onload = function () {

            var Lis = document.getElementsByTagName("li");

            for (i = 0; i < Lis.length; i++) {

                Lis[i].i = i;

               //设置鼠标移入时的样式。

                Lis[i].onmouseover = function () {

                    this.className = "lihover";

                }

                  //设置鼠标移开时的样式为空。

                Lis[i].onmouseout = function () {

                    this.className = "";

                }

            }

        }

    </script>

||

写笔记

公开笔记
提交
||

请验证，完成请求

由于请求次数过多，请先验证，完成再次请求

收藏课程后，能更快找到我哦～

使用 Ctrl+D 可将课程添加到书签

举报

0/150
提交
取消