jQuery toggle () наоборот? - PullRequest
       5

jQuery toggle () наоборот?

0 голосов
/ 17 марта 2020

У меня есть функция simpel toggle (), чтобы показывать и скрывать div при нажатии кнопки. Теперь при нажатии кнопки анимация скользит вверх. Мне было интересно, можно ли заставить его скользить вниз при нажатии кнопки. См. эту скрипку или код ниже:

<html>
    <head>
        <script>
        $( ".submit" ).click(function() {
          $( ".show_to_hide, .hide_to_show" ).toggle( "slow" );
        });
        </script>
        <style>
        .hide_to_show{display:none;}
        </style>
    </head>
    <body>
        <div class="wrapper">
          <div class="show_to_hide">

          This is hidden on click


          </div>

          <div class="hide_to_show">

          This is shown on click

          </div>

          <button class="submit">
          Submit
          </button>

        </div>
    </body>
</html>

1 Ответ

0 голосов
/ 17 марта 2020

Я предполагаю, что вы имеете в виду, что при первом нажатии кнопки анимация скользит вниз. Вы можете добиться этого просто, переместив hide_to_show class div выше show_to_hide div следующим образом:

$(".submit").click(function() {
  $( ".show_to_hide, .hide_to_show" ).toggle( "slow" );
});
.hide_to_show{display:none;}.hide_to_show,.show_to_hide{height:40px}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrapper">
  <div class="hide_to_show">
    This is shown on click
  </div>
  <div class="show_to_hide">
    This is hidden on click
  </div>

  <button class="submit" type="button">Submit</button>
</div>
...