zoukankan      html  css  js  c++  java
  • 同级元素,鼠标经过高亮,鼠标离开还原(除选中已高亮元素时),点击确定高亮

               <script type="text/javascript">
                                    $(document).ready(function() {
                                        
                                        //选择器名称
                                        var ElementLL = "#bodyNavLi li";
                                        //普通样式
                                        var Normal = "n51_box2_jh_li";
                                        //高亮样式
                                        var MouseOver = "n51_box2_jh_li_hover";

                                        //初始化(选中第一项)
                                        $(ElementLL).eq(0).addClass(MouseOver);
                                        $(ElementLL).eq(0).removeClass(Normal);


                                        //鼠标经过和离开
                                        $(ElementLL).hover(function() {
                                            var j = 0;
                                            var index = $(this).index();
                                            $(ElementLL).each(function(i) {
                                                if ($(ElementLL).eq(i).attr("class") == MouseOver) {
                                                    j = i;
                                                }
                                                else {
                                                    $(ElementLL).eq(index).addClass(MouseOver);
                                                    $(ElementLL).eq(index).removeClass(Normal);
                                                }
                                            });

                                        }, function() {
                                            var j = 0;
                                            var index = $(this).index();
                                            $(ElementLL).each(function(i) {
                                                if ($(ElementLL).eq(i).attr("class") == MouseOver) {
                                                    j++;
                                                }
                                            });

                                            if (j == 2) {
                                                $(this).removeClass(MouseOver);
                                                $(this).addClass(Normal);
                                            }
                                        });
                                        
                                        //单击选中
                                        $(ElementLL).click(function() {
                                            $(ElementLL).removeClass(MouseOver);
                                            $(ElementLL).addClass(Normal);


                                            $(this).removeClass(Normal);
                                            $(this).addClass(MouseOver);

                                        });
                                    });
                             </script>
                        
                        
                            <div id="bodyNavLi" class="n51_box2_jh">
                                <ul>                                
                                    <li id="bodyheadLi1" class="n51_box2_jh_li" onclick="MouseOver('bodyheadtext',4,1);">八字算命</li>
                                    <li id="bodyheadLi2" class="n51_box2_jh_li" onclick="MouseOver('bodyheadtext',4,2);">姓名测试</li>
                                    <li id="bodyheadLi3" class="n51_box2_jh_li" onclick="MouseOver('bodyheadtext',4,3);">号码吉凶</li>
                                    <li id="bodyheadLi4" class="n51_box2_jh_li" onclick="MouseOver('bodyheadtext',4,4);">星座配对</li>                               
                                    
                                </ul>
                                
                            </div>

    .net URL重写例子

  • 相关阅读:
    浅谈SQL Server 对于内存的管理
    【JSON解析】JSON解析
    SQLSERVER吞噬内存解决记录
    数据schemaAvro简介
    Windows命令查看文件MD5
    均分纸牌(贪心)
    an easy problem(贪心)
    导弹拦截问题(贪心)
    活动选择(贪心)
    整数区间(贪心)
  • 原文地址:https://www.cnblogs.com/yonsy/p/2789281.html
Copyright © 2011-2022 走看看