当前位置:编程学习 > C#/ASP.NET >>

求一个jquery效果

前台的:<asp:Repeater ID="reptype" runat="server" OnItemDataBound="reptype_ItemDataBound">
             <ItemTemplate>
                 <dl class="fenlei_dl">
                <dt><%#Eval("typename") %>:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        <asp:Repeater ID="reptype1" runat="server">
                       <ItemTemplate>
                                 <li  ><a href="#" ><%#Eval("typename") %></a></li>
                       </ItemTemplate>
                   </asp:Repeater>
                        </ul>
                    </dd>
                </dl>
             </ItemTemplate>
         </asp:Repeater>

写个jquer当鼠标滑动到li的时候,添加一个class current,注意是两个repeater啊。 --------------------编程问答--------------------
引用 楼主 a631373000 的回复:
前台的:<asp:Repeater ID="reptype" runat="server" OnItemDataBound="reptype_ItemDataBound">
             <ItemTemplate>
                 <dl class="fenlei_dl">
                <dt><%#Eval("typename") %>:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        <asp:Repeater ID="reptype1" runat="server">
                       <ItemTemplate>
                                 <li  ><a href="#" ><%#Eval("typename") %></a></li>
                       </ItemTemplate>
                   </asp:Repeater>
                        </ul>
                    </dd>
                </dl>
             </ItemTemplate>
         </asp:Repeater>

写个jquer当鼠标滑动到li的时候,添加一个class current,注意是两个repeater啊。



管他几个了,输出到页面上面,不都是HTML,查看HTML源码,进行分析!然后JQ在搞!

增加一个CLASS,很容易啊,addclass就可以了!
然后用onmouse什么的那个事件,就OK了! --------------------编程问答--------------------
引用 1 楼 hou306010849 的回复:
Quote: 引用 楼主 a631373000 的回复:

前台的:<asp:Repeater ID="reptype" runat="server" OnItemDataBound="reptype_ItemDataBound">
             <ItemTemplate>
                 <dl class="fenlei_dl">
                <dt><%#Eval("typename") %>:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        <asp:Repeater ID="reptype1" runat="server">
                       <ItemTemplate>
                                 <li  ><a href="#" ><%#Eval("typename") %></a></li>
                       </ItemTemplate>
                   </asp:Repeater>
                        </ul>
                    </dd>
                </dl>
             </ItemTemplate>
         </asp:Repeater>

写个jquer当鼠标滑动到li的时候,添加一个class current,注意是两个repeater啊。



管他几个了,输出到页面上面,不都是HTML,查看HTML源码,进行分析!然后JQ在搞!

增加一个CLASS,很容易啊,addclass就可以了!
然后用onmouse什么的那个事件,就OK了!
关键都是重复的不知道怎么获取到某一个li啊 --------------------编程问答-------------------- 例如
  <dl class="fenlei_dl">
                <dt>模型类别:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >12</a></li>
                       
                                 <li  ><a href="#" >66</a></li>
                       
                        </ul>
                    </dd>
                </dl>
             
                 <dl class="fenlei_dl">
                <dt>模型风格:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >巴洛克</a></li>
                       
                        </ul>
                    </dd>
                </dl>
             
                 <dl class="fenlei_dl">
                <dt>模型类别:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >粗暴型</a></li>
                       
                                 <li  ><a href="#" >温柔型</a></li>
                       
                        </ul>
                    </dd>
                </dl>
--------------------编程问答--------------------
引用 3 楼 a631373000 的回复:
例如
  <dl class="fenlei_dl">
                <dt>模型类别:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >12</a></li>
                       
                                 <li  ><a href="#" >66</a></li>
                       
                        </ul>
                    </dd>
                </dl>
             
                 <dl class="fenlei_dl">
                <dt>模型风格:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >巴洛克</a></li>
                       
                        </ul>
                    </dd>
                </dl>
             
                 <dl class="fenlei_dl">
                <dt>模型类别:</dt>
                    <dd>
                        <ul  ><!-- class="current" 为滑动到的类别 -->
                        <li class="current"><a href="#">全部</a></li>                  
                        
                                 <li  ><a href="#" >粗暴型</a></li>
                       
                                 <li  ><a href="#" >温柔型</a></li>
                       
                        </ul>
                    </dd>
                </dl>


each 不就可以么???

循环! 多看下JQ文档! --------------------编程问答--------------------

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">

        $(function () {
            $("li").not(".current").hover(
                function ()
                {
                    $(this).css("background", "pink");
                },
                function ()
                {
                    $(this).css("background", "white");
                }
            );

        });
    </script>
</head>
<body>
    <div>
        <dl>
            <dt></dt>
            <dd>
                <ul>
                    <li class="current">Parent</li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                </ul>
            </dd>
        </dl>
        <dl>
            <dt></dt>
            <dd>
                <ul>
                    <li class="current">Parent</li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                    <li> - - - - </li>
                </ul>
            </dd>
        </dl>
    </div>
</body>
</html>

--------------------编程问答-------------------- 你可用jquery的hover事件来完成$().hover(function(){//鼠标移上时执行函数},function(){//鼠标离开时执行函数}),也就是说鼠标移上时可以addClass("你的样式名"),鼠标移出时可以removeClass("你的样式名")
补充:.NET技术 ,  ASP.NET
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,