Trying to make a twitter-bootstrap navbar sticky in the middle of content.
Using the sticky jquery plugin, found on its Github page.
According to the Github page, sometimes a fixed width is needed for sticky elements:
"In some cases you might need to set a fixed width to your element when it is 'sticked'."
Tested with these examples:
Difference lies in setting width:
width:20px;
Struggling to make it work for navbar - jumps to smaller width and stays when scrolled.
Issue shown here: Example.
Torn between fixing appearance with fixed width or breaking Twitter-Bootstrap functionality.
Even after adding fixed width, still not sticky:
#stickynavbar{
width:200px;
}
Question remains:
- How to solve this specific problem?
- Considering alternative plugins or approaches at early project stage.
Open to any guidance in right direction!