Questions tagged [sticky]

In web pages, a sticky element is an element of the page that stays at a fixed position on the screen, making it always visible.

In web pages, a sticky element is an element of the page that stays at a fixed position on the screen, making it always visible.

This is achieved using some CSS positioning attributes, possibly in combination with some javascript for additional features. See also: https://stackoverflow.com/tags/sticky-footer/info

1952 questions
9
votes
2 answers

Sticky Position: Header scrolled away after a while

On my website I have made the
user3340372
9
votes
4 answers

Keep footer at bottom but not sticky?

My basic layout is simple: header { background: red; } main { background: aqua; font-size: 48px; } footer { background: grey; position: fixed; bottom: 0; width: 100%; padding:…
justinw
  • 3,856
  • 5
  • 26
  • 41
9
votes
3 answers

How do I implement server affinity or sticky sessions on App Engine?

My application wishes to have: Automatic scalability I want App Engine to spin up new instances of my app when traffic increases When instances become idle, I want App Engine to shut them down Client/server affinity After an initial…
Fred Sauer
  • 1,012
  • 9
  • 20
8
votes
4 answers

Sticky HTML element gets hidden below the Mobile navigation bar in chrome / Firefox mobile browser. How to fix this? [ UPDATED ]

REQUIREMENT : I have an action bar with button called Next Scale, which is of position: sticky and bottom: 0 in mobile view. I want this HTML element to stick to the bottom of the viewport as we scroll and stays to the bottom when it is out of…
Neyo
  • 523
  • 1
  • 8
  • 23
8
votes
1 answer

Position sticky for sidebar whick is larger than screen size

I have a sidebar whose height is larger than the screen size and when using position: sticky, I won't be able to see the bottom of the sidebar until I scroll to the end of the page. How can I make sure that when scrolling, for example, 50% of the…
Malzeriy
  • 127
  • 2
  • 13
8
votes
1 answer

position:sticky ignoring right value in chrome

I have a very simple need: make and element sticky on the right side of the screen. All works fine in Firefox, but in Chrome the right: 0 property is ignored. I said nevermind, I can achieve my goals by using left: calc(100% - 80px); but this is a…
brett
  • 744
  • 5
  • 15
8
votes
2 answers

How to get sticky / Pinned Headers in an ExpandableListView?

Has anyone had any luck adapting PinnedHeaderListView so that it can be used with an ExpandableListView instead of just a simple ListView with indexed sections? I basically want an ExpandableListView where each group item view stays pinned to the…
8
votes
2 answers

Remove unwanted space with position sticky

I'm trying to use position: sticky on a rotated element but I get extra space at the top. Also where the sticky element has to stops (at the end of parent) it goes outside. Notice I need to have control to choose how many pixels put between sticky…
Fred K
  • 13,249
  • 14
  • 78
  • 103
8
votes
2 answers

Make position: fixed behavior like sticky (for Vue2)

Position: sticky doesn't support by the most mobile browsers. But position: fixed is not that thing I need (because of fixed block overlaps content in the bottom of document). I guess for jquery it will be easy to set static position for fixed block…
Maria
  • 95
  • 1
  • 1
  • 5
8
votes
3 answers

Creating a sticky bar in Semantic UI (React). Page jumps when scrolling

I'm using the component in semantic to create a top menu + breadcrumb header. For some reason, the scroll bar "jumps" when trying to scroll from the topmost position Sandbox https://codesandbox.io/s/y7k3zn5qn1 I haven't provided the context prop to…
PrashanD
  • 2,643
  • 4
  • 28
  • 58
8
votes
2 answers

Fixed div between two div elements

I try to create a fixed div element when the scroll position is between two div elements. I use this code to create the fixed element: var sidebar = $('.sidebar').offset().top; $(window).scroll(function() { if ($(window).scrollTop() >…
Appel
  • 497
  • 5
  • 13
8
votes
1 answer

Zurb Foundation 6 sticky switch status at end of viewport height ".is-anchored .is-at-bottom"

Trying to create a menu that is sticked to the top of site whole time. Followed docs of zurb.foundation, but .sticky behaves always the same unexpected way. Or maybe I don't get some obvious? Please check for reconstruction…
Herr_Hansen
  • 2,292
  • 1
  • 20
  • 17
8
votes
1 answer

Javascript sticky div after scroll

This question maybe stupid for many here. I am making sticky div after scroll in pure JS. Some people may advice to make it in jQuery but i am not interested in it. What i need is something similar to this. Here the div moves all the way to top but…
Kishore
  • 749
  • 6
  • 14
  • 18
8
votes
1 answer

Force graphviz to preserve node positions

I have a graph that changes over time (normally, new nodes are added). I need to regenerate the graph several times, and want all of the nodes to stick where they have been. This partially works when using graphviz with the fdp-algorithm, setting…
sudoremo
  • 2,274
  • 2
  • 22
  • 39
7
votes
2 answers

How can I make the first and second column of a table sticky

i have a div with with property
` inside this div i have the table which has class views-table, this table has 100% width which makes it's parent…
Punit
  • 1,110
  • 1
  • 8
  • 14