jQuery Нажмите событие, чтобы сделать div slide вниз и нажмите Next Div из ViewStor

Question

Я пытаюсь выяснить, как сделать jQuery Slide # Content2 вниз и заменить # Content1 с ним во время того, чтобы он выглядел как # Content1 на самом деле выталкивается с помощью # Content2, удаляя его с вида ...

Тогда одна и та же кнопка, которая нажала, чтобы сделать # Content2 «Заменить # Content1», также потребуется сделать обратный эффект, заменяя # Content2 с помощью # Content1, заставляя их выдвигать вверх и выдвигать друг друга.

Я не все, что отлично с jQuery, так что я уверен, что я не тот неправильный путь, но вот что я пробовал:

$(document).ready(function() {
$('#click').click(function() {
 if($('#content1').is(':visible')) {
  $('#content1').slideUp();
 }
 else {
  $('#content2').slideDown();
 }
}).click(function() {
 if($('#content1').is(':visible')) {
  $('#content2').slideDown();
 }
 else {
  $('#content1').slideUp();
 }
});

});

Answer 1

Вам нужно только привязать щелчок один раз, и вы сможете переключить эффект слайда. Вы можете попробовать что-то вроде этого

$(document).ready(function() {

  $('#click').click(function() {
    $('#content1').slideToggle();
    $('#content2').slideToggle();
  }
}

Answer 2

Теперь вы пытаетесь связать два обработчика событий Click к одному и тому же элементу. Это невозможно, как вы пытаетесь, но с именными событиями это:$(#click).bind('click.event1') а потом позже .bind('click.event2')

Однако вы можете все в одной функции:

$(document).ready(function() {
    // Pre selected for increased speed
    var content1 = $('#content1');
    var content2 = $('#content2');

    $('#click').click(function() {
        content1.slideToggle();
        content2.slideToggle();
    });
});

Это не будет в синхронизации Perfekt, но, вероятно, будет выглядеть хорошо.