在这个很酷的菜单中使用了哪些脚本?

时间:2013-07-13 18:13:50

标签: jquery

我想弄清楚在这个很酷的菜单中使用了哪些脚本,以便做类似的事情。点击菜单上的任何项目,看看我在说什么。 http://soc.haifa.ac.il/~tkatz/

谢谢!

4 个答案:

答案 0 :(得分:3)

无。它只使用精心设计的jQuery animate函数

实施例

$("html, body").animate({
    scrollTop:the_top
},1000,function(){

此页面是单页网站的完美示例。所有代码都在页面内嵌。

the_top设置为offset().top()的预定义div,该click()应该在65中以$("#menu a").click(function(e){ e.preventDefault(); var the_id = $(this).attr('href'); var the_top = $("#div_"+the_id).offset().top - 65; highlight_menu(the_id); //$("#menu").animate({"top":"-=96"},500).animate({"top":"+=96"},500) $("html, body").animate({ scrollTop:the_top },1000,function(){ }) }) function highlight_menu(which) { $("#menu a").removeClass('this'); $("#menu a[href='"+which+"']").addClass('this'); $("#ball").animate({ "left":$("#menu a[href='"+which+"']").position().left+$("#menu a[href='"+which+"']").width()/2+17+"px" }, 750, function(){ }) } px的空间显示在菜单栏中在页面顶部。

很酷的菜单代码

{{1}}

答案 1 :(得分:0)

我不知道这个网站上有哪一个,但我知道可以用Jquery Lava Lamp完成:http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/

答案 2 :(得分:0)

这是jquery,并且使用$ .scroll和$ .animate有点努力,肯定是$ .click

答案 3 :(得分:0)

有各种各样的脚本:

你可以试试 http://johnpolacek.github.io/scrollorama/

这是如何实现它: http://johnpolacek.github.io/scrolldeck.js/

或者有ScrollTo http://demos.flesler.com/jquery/scrollTo/

欢呼声 .ben。