Javascript 反向手风琴方向

Javascript 反向手风琴方向,javascript,jquery,css,zurb-foundation,accordion,Javascript,Jquery,Css,Zurb Foundation,Accordion,这是你的电话号码 我如何反转Zurb手风琴打开的方向 -访问代码为000 我希望手风琴能向上/垂直向上滑动,而不是向下滑动。 纯CSS是邪恶的,但如果J$有效,那也太棒了 :) 感谢您的关注尝试以下方式: JS: $(".accordion").on("click", "dd:not(.active)", function (event) { $("dd.active").removeClass('active').find(".content").slideUp("slow"); $(

这是你的电话号码

我如何反转Zurb手风琴打开的方向

-访问代码为000

我希望手风琴能向上/垂直向上滑动,而不是向下滑动。 纯CSS是邪恶的,但如果J$有效,那也太棒了

:)

感谢您的关注

尝试以下方式:

JS:

$(".accordion").on("click", "dd:not(.active)", function (event) {
  $("dd.active").removeClass('active').find(".content").slideUp("slow");
  $(this).addClass('active').find(".content").slideToggle("slow");
  });

我已经根据它定制了。所以它是向上的。。。我想这对你有帮助

.accordion .accordion-navigation.active > a, .accordion dd.active > a {
      background: #e8e8e8;
       position:relative;
        top:85px; // Change this
      }
    .accordion .accordion-navigation > a, .accordion dd > a {
      background: #efefef;
      color: #222222;
      padding: 1rem;
      display: block;
      font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
      font-size: 1rem; }
      .accordion .accordion-navigation > a:hover, .accordion dd > a:hover {
        background: #e3e3e3; }
    .accordion .accordion-navigation > .content, .accordion dd > .content {
      display: none;
      padding: 0.9375rem; }
      .accordion .accordion-navigation > .content.active, .accordion dd > .content.active {
        display: block;     
        background: white; 
        position:relative;
        top:-55px; // Change this too
        }

你唯一要做的就是。。。你必须定位子div.

try.slideToggle(),.slideUp()当我将此代码-->包装到标记中时,我没有运气你没有将ZURB库包含在fiddle中你能创建一个fiddle吗,您可以使用上面提到的两个函数中的任何一个。当我将您的代码块复制粘贴到CodePen@中时,请检查此函数,而不是上面的fiddle-->函数,因为它没有解决问题。不过,动画增强了,效果很慢!