Questions tagged [affix]

An additional element placed at the beginning or end of something.

An additional element placed at the beginning or end of a root, stem, or word, or in the body of a word, to modify its meaning. In Twitter Bootstrap it is prepend.

Prepended and appended inputs in BootStrap.

Add text or buttons before or after any text-based input. Do note that select elements are not supported here.

Wrapping an .add-on and an input with one of two classes to prepend or append text to an input.

214 questions
2
votes
1 answer

Getting affix to work with bootstrap 4

I'm doing an attempt of getting the affix.js to work with bootstrap 4. Here is the official js: https://github.com/twbs/bootstrap/blob/master/js/affix.js This works for example: #foo.affix { top: 20px; color: red; position: fixed; } But…
clankill3r
  • 9,146
  • 20
  • 70
  • 126
2
votes
1 answer

Affixed design with independent columns - twitter bootstrap

I am having great difficulties with achieving this look on my page: The layout Basicaly I want a couple of rows on the left with content in divs that have a boxy-design like this. Then on the right I want three divs that look like on the picture.…
D.Wisen
  • 21
  • 3
2
votes
1 answer

Detect when an affixed element has returned to its original position

How can I detect when a Bootstrap affixed element has returned to its starting position and is no longer affixed?
Broett
  • 33
  • 3
2
votes
1 answer

'Skips' when using Bootstrap's Affix

I'm attempting to use Bootstraps Affix function in a sticky subnav.
Pete Fecteau
  • 302
  • 3
  • 5
2
votes
1 answer

Affix with scrolling Bootstrap modal

I have a bootstrap modal which sometimes needs to scroll vertically; I want to have a group of DIVs on the right hand side that affix (auto-scroll) as the page scrolls, but using the standard suggestion, nothing much is working.... I have spent all…
tornadof3
  • 234
  • 1
  • 8
2
votes
2 answers

Fixed Header and Bootstrap Affix - Jump

I want that the top title will be stay even when scrolling, it works, but the content will jump and seems bad. My JS: jQuery('.header').affix({ offset: { top:$('.header').offset().top } });
2
votes
1 answer

Bootstrap Affix Jumping About

I want an image to stick to the right hand side whilst the page scroll and I have settled on bootstraps affix for this process http://jsfiddle.net/7rhdLcz7/ $(function () { $('#image').affix({ offset: { top: 200, …
Oliver Whysall
  • 351
  • 1
  • 6
  • 17
2
votes
1 answer

Bootstrap Affix on bottom scroll glitch (Chrome and Firefox)

Simple page with 2 level header, where 2nd level sticks to top. Here is the page skeleton: http://jsbin.com/cimobirimisi/9 If you re-size your browser to around 630px of height and try to scroll down, you should notice scroll glitch. Not a problem…
user2174835
  • 357
  • 3
  • 11
2
votes
1 answer

How can I create a fluid and responsive horizontal toolbar with affix in Bootstrap 3?

As I have stated in the title, I'm trying to create a horizontal toolbar with affix in Bootstrap. I don't mind if the toolbar is wrapped in a well, a nav or a panel as long as it's horizontal and uses affix. I'm currently using a well, I have tried…
2
votes
1 answer

bootstrap 2.3.2 affix bottom jumps between affix and affix-bottom

I'm using twitter bootstrap 2.3.2 and included the affix js. The div perfectly listens to the top:500px; but has difficulties with the bottom, on reaching bottom, it switches the div name between affix and affix-bottom every pixel. Looking nineties…
mrBrown
  • 153
  • 1
  • 10
2
votes
2 answers

Sticky.js width:100% nav no longer 100% after resize of browser

I have implemented a width:100% nav bar that closely mimics the nav bar found on this site: (http://halfcreative.themes.bitfade.com/). My nav bar is to be made sticky upon the nav reaching the top of the page and this is quite successfully…
daniel blythe
  • 946
  • 2
  • 16
  • 44
2
votes
0 answers

bootstrap affix bottom not smooth in Firefox

I got problem about bootstrap affix-bottom on this code : http://jsfiddle.net/uvnGP/131/ var headerHeight = $('header').outerHeight(true); var footerHeight = $('footer').innerHeight(); $('#account-overview-container').affix({ offset: { top:…
2
votes
1 answer

Twitter Bootstrap Affix: disappears under the footer

I'm trying to use Affix, but I have some problem: when I scroll down - my affix div partially disappears under the footer, here is a jsbin example and code. How can I prevent this? data-offset-bottom="anynumber" - don't work.
Evgeny Samsonov
  • 2,730
  • 4
  • 19
  • 28
2
votes
2 answers

AngularJS/UI/Bootstrap remove affix from an element?

I am using AngularJS 1.2 and Bootstrap 2.3, although I think it is irrelevant that Angular is involved since this is just jQuery. I want to be able to turn the affix on and off for a particular element. I have multiple elements on my page using…
2
votes
0 answers

Bootstrap navbar affix blurry with disappearing workaround in Chrome

At first, I was having a problem with the navbar intermittently disappearing after clicking on a nav link in the navbar. Googling found this to be a bug, and this was suggested as a fix (https://github.com/twbs/bootstrap/issues/32, Chrome rendering…
dsharlet
  • 1,036
  • 1
  • 8
  • 15