Question

嘿所以我想知道如何让网页的一部分向下滑动，揭示其背后的另一个div。我希望触发器能够点击一个标签（虽然如果那不可能，那么我可以改变它......）

我如何构建这个以及jquery和CSS适合什么？我有HTML和CSS方面的经验，但在jquery中几乎没有。

感谢。

Answer 1

您可以使用的简单示例：

<a id="myLink">Click me</a>
<div id="mySlider">Tada!</div>

JS：

$(function() {
    $('#myLink').click(function() {
        $('#mySlider').slideDown();
    });
});

http://jsfiddle.net/samliew/txcbA/

Answer 2

您可以在锚标记内使用onclick属性，类似于以下内容：

<a id="mydiv" onclick=myfunction()>text</a>

然后在html文档头部的脚本标记内，定义myfunction（）。 myfunction（）将显示嵌套的div，最初将设置为隐藏 - 可能使用css。

myfunction()
{
    $('#nested_div').show();
}

这假设嵌套div的id是“nested_div”。你还必须确保一个jquery库1）通过html页面链接，2）位于指定的路径。

希望这会有所帮助。

Answer 3

如果您想使用相同按钮显示和隐藏它，请使用slideToggle()代替slideDown：

$("#link").click(function(){
    $("#div").slideToggle();
});

Answer 4

JS

$('.tag').click(function(){
    ($('#top').css("margin-top")=="0px") ? $('#top').animate({marginTop:"100px"},500) : $('#top').animate({marginTop:"0px"},500); 
});

创建了一个带有工作演示的jsFiddle - http://jsfiddle.net/Kh3GE/

享受

Answer 5

只需使用$（“＃div”）。slideToggle（）;

使用触发锚标记点击事件的功能。

$(function()
  {
      $('#dropIt').click(function(e)
        {
            e.preventDefault();
            $('.dropdown').slideToggle(2000);
        });
  });

以下是参考：Demo

使用带有锚标记触发器的jquery来显示div

5 个答案: