1按钮上的jQuery多功能

所以我有一个按钮，我试图让多个功能一起工作。在页面加载时，上面的div是隐藏的，一旦按钮被点击，它将使div可见并滚动到顶部。我可以分开工作，但不能在一起工作。有人能指出我做错了什么吗？1按钮上的jQuery多功能

$(function() { 
    $("#work").hide(); 
    $(".button").bind("click", function() { 
     $("#work").show(); 
    }); 
    $(".button").click(function() { 
     $('html, body').animate({ 
      scrollTop: $("#work").offset().top 
     }, 2000); 
    }); 
});

更新1：

加入了小提琴：http://jsfiddle.net/5qQJN/1/

更新2：

所以它管理工作，但点击它之后，才一次。说你点击它，跳到顶部，你再次向下滚动点击，然后它将与动画滚动..所以这意味着我需要一个窗口负载？

来源

2013-03-13 Sneezy

$(function() { 
    $("#work").hide(); 
    $(".button").click(function() { 
     $("#work").show(); 
     $('html, body').animate({ 
      scrollTop: $("#work").offset().top 
     }, 2000); 
    }); 
});

结合它们应该工作，因为没有任何东西看起来像是动态加载。

来源

2013-03-13 21:00:04 j08691

^这 - 我想知道自己为什么需要两个点击处理程序，这可能是在OP的示例代码中过分简化。 – Adrian 2013-03-13 21:00:39

感谢您的回复和编辑。然而，仍然没有骰子，当我点击按钮的div将出现，它将滚动到顶部，但没有动画，只是一个跳跃。 – Sneezy 2013-03-13 21:05:57

你可以用你的HTML更新你的问题，并且如果可能的话，用一个说明问题的jsFiddle。 – j08691 2013-03-13 21:06:36

我做了一个捣鼓你：http://jsfiddle.net/FaC4r/

看起来像它在那里工作。如果你提供了你的HTML，这将有所帮助。

THE DIV IS HIDDEN UP HERE - SCROLL DOWN FOR BUTTON 
<div id="work"></div> 

<div id="spacer"></div> 

<input type="button" class="button" value="CLICK ME TO SHOW 'WORK' AND SCROLL UP TO IT">

[更新基于评论]

我编辑的小提琴为你和你的新的HTML：http://jsfiddle.net/FaC4r/2/

好像你的CSS被指定以0填充，即一个工作格，合并事实上div中没有任何东西，意味着它是无形的！你可以在上面的小提琴中看到，我在填充中使用了2em，以确保我实际上看到了div的增长和扩展。

我会说 - 这对于您的编程生涯中的基本所有内容都是正确的 - 使用工作示例作为基础并逐步添加您的特定需求。尽早并经常进行测试。添加一件事物并测试以确保它完成了您的预期。一旦你建立了一定的舒适度，你就可以延长这个迭代周期。

希望有帮助！ :)

来源

2013-03-13 21:07:03 Andrew

欣赏帮助..这很奇怪，我觉得它应该工作，但由于某种原因，它不是。如果你注意到任何知道的东西，我会提起一个小提琴，我对代码还很陌生。再次感谢。 – Sneezy 2013-03-13 21:38:44

1按钮上的jQuery多功能

回答

相关问题