Scroll then snap to top?

Just do a quick "view source" on lesscss.org and you'll see this: window. Onscroll = function () { if (!docked && (menu. OffsetTop - scrollTop() Top = 0; menu.style.

Position = 'fixed'; menu. ClassName = 'docked'; docked = true; } else if (docked && scrollTop() Position = 'absolute'; menu.style. Top = init + 'px'; menu.

ClassName = menu.className. Replace('docked', ''); docked = false; } } They're binding to the onscroll event for the window, this event is triggered when the window scrolls. The docked flag is set to true when the menu is "locked" to the top of the page, the menu is set to position:fixed at the same time that that flag is set to true The rest is just some simple "are we about to scroll the menu off the page" and "are we about back where we started" position checking logic You have to be careful with onscroll events though, they can fire a lot in rapid succession so your handler needs to be pretty quick and should precompute as much as possible In jQuery, it would look pretty much the same: $(window).

Scroll(function() { // Pretty much the same as what's on lesscss. Org }) You see this sort of thing quite often with the "floating almost fixed position vertical toolbar" things such as those on cracked.com.

Just do a quick "view source" on lesscss.org/ and you'll see this: window. Onscroll = function () { if (!docked && (menu. OffsetTop - scrollTop() Top = 0; menu.style.

Position = 'fixed'; menu. ClassName = 'docked'; docked = true; } else if (docked && scrollTop() Position = 'absolute'; menu.style. Top = init + 'px'; menu.

ClassName = menu.className. Replace('docked', ''); docked = false; } }; They're binding to the onscroll event for the window, this event is triggered when the window scrolls. The docked flag is set to true when the menu is "locked" to the top of the page, the menu is set to position:fixed at the same time that that flag is set to true.

The rest is just some simple "are we about to scroll the menu off the page" and "are we about back where we started" position checking logic. You have to be careful with onscroll events though, they can fire a lot in rapid succession so your handler needs to be pretty quick and should precompute as much as possible. In jQuery, it would look pretty much the same: $(window).

Scroll(function() { // Pretty much the same as what's on lesscss. Org }); You see this sort of thing quite often with the "floating almost fixed position vertical toolbar" things such as those on cracked.com.

Sounds like an application of Jquery ScrollTop and some manipulation of CSS properties of the navbar element. So for example, under certain scroll conditions the navbar element is changed from absolute positioning with calculated co-ordinates to fixed positioning. api.jquery.com/scrollTop.

I'll be honest, I took a look at that and found no way of getting something to lock to the top. – mediarts Feb 26 at 1:37.

The effect you describe would usually start with some type of animation, like in TheDeveloper's answer. Default animations typically slide an element around by changing its position over time or fade an element in/out by changing its opacity, etc. Getting the "bouce back" or "snap to" effect usually involves easing. All major frameworks have some form of easing available.

It's all about personal preference; you can't really go wrong with any of them. JQuery has easing plugins that you could use with the .animate() function, or you can use jQueryUI. MooTools has easing built in to the FX class of the core library.

Yahoo's YUI also has easing built in. If you can remember what site it was, you could always visit it again and take a look at their source to see what framework and effect was used.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions