Question

我正在试图弄清楚如何制作jQuery slide＃content2并用它取代＃content1，同时使它看起来像＃content1实际上被＃content2推下来从视图中删除...

然后，点击＃content2替换#content1的相同按钮也需要通过将＃content2替换为#intent1来实现相反的效果，使它们向上滑动并相互推开......

我对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).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同步中，但可能看起来不错。

jQuery单击事件以使div向下滑动并将下一个div推出视口

2 个答案: