Fairly a enjoyable article I labored on with Philip Braunen. Are you aware that little little bit of elasticity you get when scrolling past the viewport when searching the online on a cellular machine? iPhone calls it a “rubber-banding” impact. And it’s cool as a result of Apple has beforehand fought to carry a copyright on it.
Anyway, Philip wrote into Smashing Journal with a intelligent method to imitate rubber-banding in CSS — not just for non-mobile UI but in addition utilized to any type of container you want.
However what about sticky headers and footers? If these must be pinned to the container’s block edges, then how in heck will we embrace them within the rubber banding? Phillip’s trick is an additional div earlier than the header, although we will get extra concise markup utilizing pseudos as an alternative.
Direct Hyperlink →
