JQuery Slidetoggle不会滑动(没有错误,包含代码)

时间:2014-01-28 02:43:03

标签: javascript php jquery slidetoggle

所以我在我试过的第一页上就可以正常工作了:

http://www.uksf.net/platoon.php

但我无法在首页上发挥作用:

http://www.uksf.net/index.php(侧边的导航栏应该有一个小菜单下拉(你可以在检查员身上看到))。

幻灯片切换不起作用我花了几天时间试图解决这个问题,所以我没有突发奇想,帮助表示感谢。

这是html

<div class="sn1">
  <div class="sidelink">Enlistment</div>
      <div class="sn1group">
          <div class="sidelinksub">
               <div>&gt;&gt; Application</div>
               <div>&gt;&gt; Roles</div>
          </div>
      </div>

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
      $(document).ready(function(){
          $(".sn1").click(function(){
          $(".sn1group").slideToggle("slow");
          });
      });
  </script>
  </div>
</div>

这是CSS

.sidelink{

width:auto;
height:auto;
color:white;
font-size:25px;
text-align:center;
padding: 8px 1px;
margin: 0px;
margin-top: 4px;
border-style:solid;
border-width:1px;
border-color:rgba(25,25,25,0.85);
background-size:234px 55px;
background-image:url('../img/mc2.png');
display:block;
overflow:auto;
}

.sidelinksub{
width:160px;
height:auto;
color:white;
font-size:10px;
text-align:left;
padding: 4px 1px;
margin-left: 38px;
margin-bottom:4px;
border-style:solid;
border-width:1px;
border-color:rgba(25,25,25,0.85);
background-color:rgba(48,48,48,0.75);
display:block;
overflow:auto;
}

2 个答案:

答案 0 :(得分:0)

您需要将jQuery代码放在另一个script标记中:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script>
    $(document).ready(function(){
        $(".sn1").click(function(){
            $(".sn1group").slideToggle("slow");
        });
    });
</script>

答案 1 :(得分:0)

如果你正在使用CDN的jQuery库,我会给脚本标签提供以下属性。你需要将type =“text / javascript”用于嵌入式脚本,使用javascript等javascript或js库。还要在src属性中添加完整的url(当使用PHP时,你应该将动态链接添加到你想要使用的样式表中):

<script src="http://code.jquery.com/jquery-1.10.1.min.js"  type="text/javascript">
   enter code here
</script>