• jQuery 鼠标停留样式


    1 页面实现ul li之间鼠标停留离开,相应的div展开或隐藏。

    2这种写法可以实现移入展示相应div,移出隐藏相应div,但是鼠标离开ul的区域后,无法选中最后一次鼠标停留的地方

    <script type="text/javascript">
                jQuery(document).ready(function () {
                    jQuery("#tabSelect li").hover(function () {
                        var seid = "#se" + jQuery(this).attr("id") + "";
                        jQuery(this).attr("class", "current");
                        jQuery(seid).show();
                    }, function () {
                        var seid = "#se" + jQuery(this).attr("id") + "";
                        jQuery(this).attr("class", "");
                        jQuery(seid).hide();
                    });
                });
    </script>

    3   改进一下写法,siblings取同级兄弟层级,自己加class,兄弟层级移除class,相应div显示,同级div隐藏

        可以实现2所有功能,并能在鼠标离开该区域后,仍有默认显示最后一次鼠标停留的样式。

    <script type="text/javascript">
                  jQuery(document).ready(function () {
                      jQuery("#tabSelect li").bind("mouseover", function () {
                          jQuery(this).addClass("current").siblings().removeClass('current');
                          var seid = "#se" + jQuery(this).attr("id") + "";
                          jQuery(seid).show().siblings().hide();
                      });
                  })       
    </script>

  • 相关阅读:
    Javascript操作DOM常用API总结
    实用技巧之Visio绘制流程框图
    实用技巧之Visio绘图
    回复《竞赛部的一封信》
    学习之路
    《软件工程》上课精华分享
    《编译原理》上课笔记2
    sql server2008 远程过程调用失败
    《编译原理》上课笔记1
    python的第五天(复习数据类型)
  • 原文地址:https://www.cnblogs.com/judy0605/p/2770196.html
Copyright © 2020-2023  润新知