Javascript Jquery向上滑动问题

好的，下面代码的目标是让左上角向下滑动，右下角向上滑动

$（文档）.ready（函数（）{
$（“#滑块”）。单击（函数（）{
/*左侧*/
$（“#左上”）。向下滑动（2000）；
$（“#主左”）.slideUp（7000）；
/*右侧*/
$（“#主右”）。向下滑动（2000年）；
$（“#右下”）。slideUp（2000）；
});
});
正文{
背景颜色：灰色；
边际：0px；
利润上限：-15px；
/*这可以也应该被忽略。这只是为了更好地在堆栈溢出代码段中查看*/
}
#左上角{
显示：无；
浮动：左；
宽度：50%；
背景颜色：绿色；
垫底：100%；
z指数：1000；
}
#右下角{
显示：无；
背景颜色：灰色；
垫底：100%；
z指数：1000；
}
#主要左派{
填充顶部：50px；
位置：固定；
宽度：50%；
身高：100%；
背景颜色：蓝色；
z指数：-10；
}
#主要权利{
浮动：对；
背景色：红色；
宽度：50%；
垫底：100%；
z指数：-10；
}

隐藏内容

主要内容

按我！
更多隐藏内容

附带内容

您需要更改给定的时间间隔

像

签出此项
您需要更改给定的时间间隔

像

签出此项
更改您的功能

$(document).ready(function() {
  $("#slider").click(function() {
    /*LEFT-SIDE*/
    $("#top-left").slideDown(2000);
    $("#main-left").slideUp(1000);
    /*RIGHT SIDE*/
    $("#main-right").slideUp(2000);// Change Here
    $("#bottom-right").slideDown(2000);// Change Here
  });
});

更改您的功能

$(document).ready(function() {
  $("#slider").click(function() {
    /*LEFT-SIDE*/
    $("#top-left").slideDown(2000);
    $("#main-left").slideUp(1000);
    /*RIGHT SIDE*/
    $("#main-right").slideUp(2000);// Change Here
    $("#bottom-right").slideDown(2000);// Change Here
  });
});


$（文档）.ready（函数（）{
$（“#滑块”）。单击（函数（）{
/*左侧*/
$（“#左上”）。向下滑动（2000）；
$（“#主左”）.slideUp（7000）；
/*右侧*/
$（“#右下”）。slideUp（2000）；
$（“#主右”）。slideUp（2000）；
});
});
正文{
背景颜色：灰色；
边际：0px；
利润上限：-15px；
/*这可以也应该被忽略。这只是为了更好地在堆栈溢出代码段中查看*/
}
#左上角{
显示：无；
浮动：左；
宽度：50%；
背景颜色：绿色；
垫底：100%；
z指数：1000；
}
#右下角{
显示：无；
背景颜色：灰色；
垫底：100%；
z指数：2000；
}
#主要左派{
填充顶部：50px；
位置：固定；
宽度：50%；
身高：100%；
背景颜色：蓝色；
z指数：-10；
}
#主要权利{
浮动：对；
背景色：红色；
宽度：50%；
垫底：100%；
z指数：-10；
}

隐藏内容

主要内容

按我！
更多隐藏内容

附带内容


$（文档）.ready（函数（）{
$（“#滑块”）。单击（函数（）{
/*左侧*/
$（“#左上”）。向下滑动（2000）；
$（“#主左”）.slideUp（7000）；
/*右侧*/
$（“#右下”）。slideUp（2000）；
$（“#主右”）。slideUp（2000）；
});
});
正文{
背景颜色：灰色；
边际：0px；
利润上限：-15px；
/*这可以也应该被忽略。这只是为了更好地在堆栈溢出代码段中查看*/
}
#左上角{
显示：无；
浮动：左；
宽度：50%；
背景颜色：绿色；
垫底：100%；
z指数：1000；
}
#右下角{
显示：无；
背景颜色：灰色；
垫底：100%；
z指数：2000；
}
#主要左派{
填充顶部：50px；
位置：固定；
宽度：50%；
身高：100%；
背景颜色：蓝色；
z指数：-10；
}
#主要权利{
浮动：对；
背景色：红色；
宽度：50%；
垫底：100%；
z指数：-10；
}

隐藏内容

主要内容

按我！
更多隐藏内容

附带内容

您应该按照以下方式在Jquery中进行更改。因为
slideUp
将隐藏该div，而您正试图显示该div

并将css应用于
float:right；宽度：50%至
#右下角

<section id="main-right">
    <p>Side Content</p>
  </section>
  <section id="bottom-right">
    <p>More hidden Content</p>
  </section>

正文{
背景颜色：灰色；
边际：0px；
利润上限：-15px；
/*这可以也应该被忽略。这只是为了更好地在堆栈溢出代码段中查看*/
}
#左上角{
显示：无；
浮动：左；
宽度：50%；
背景颜色：绿色；
垫底：100%；
z指数：1000；
}
#右下角{
显示：无；
背景颜色：灰色；
z指数：1000；
浮动：对；
宽度：50%；
}
#主要左派{
填充顶部：50px；
位置：固定；
宽度：50%；
身高：100%；
背景颜色：蓝色；
z指数：-10；
}
#主要权利{
浮动：对；
背景色：红色；
宽度：50%；
垫底：100%；
z指数：-10；
}

隐藏内容

主要内容

按我！
附带内容

更多隐藏内容

您应该按照以下方式在Jquery中进行更改。因为
slideUp
将隐藏该div，而您正试图显示该div

并将css应用于
float:right；宽度：50%至
#右下角

<section id="main-right">
    <p>Side Content</p>
  </section>
  <section id="bottom-right">
    <p>More hidden Content</p>
  </section>

正文{
背景颜色：灰色；
边际：0px；
利润上限：-15px；
/*这可以也应该被忽略。这只是为了更好地在堆栈溢出代码段中查看*/
}
#左上角{
显示：无；
浮动：左；
宽度：50%；
背景颜色：绿色；
垫底：100%；
z指数：1000；
}
#右下角{
显示：无；
背景颜色：灰色；
z指数：1000；
浮动：对；
宽度：50%；
}
#主要左派{
填充顶部：50px；
位置：固定；
宽度：50%；
身高：100%；
背景颜色：蓝色；
z指数：-10；
}
#主要权利{
浮动：对；
背景色：红色；
宽度：50%；
垫底：100%；
z指数：-10；
}

隐藏内容

主要内容

按我！
附带内容

更多隐藏内容

很抱歉没有澄清，但我需要右下角向上滑动而不是向下滑动。很抱歉没有澄清，但我需要右下角向上滑动而不是向下滑动。很抱歉没有澄清，但我需要右下角向上滑动而不是向下滑动。我很抱歉