fl00r
fl00r

Reputation: 83680

Fixed div position with controls on the bottom until window is scrolled to its original place

I have got a form with long list of fields. So I want to see Submit allways on the bottom. And it should be there till I scroll to its original position.

I've tried to do a sample:

http://jsfiddle.net/kSpjh/2/

But the code is ugly and ther is an issue that gray panel should be 100% till scrolling

Upvotes: 1

Views: 397

Answers (2)

maxedison
maxedison

Reputation: 17553

Not sure what you think is so ugly about the code. I didn't look at it in depth, but it's pretty short, so I can't imagine it's that poorly constructed.

Beyond that, is the only other issue that you want the background of #sticker to extend across the full length of the screen? In that case, just give it a width:100% in the CSS:

http://jsfiddle.net/ebiewener/kSpjh/5/

But you also said that it "should be 100% till scrolling", so does that mean you want it to contract to the smaller size once scrolling begins? If so, you should put the width:100% in the $(document).ready() function, so that you can then remove it as a result of the .scroll() event:

http://jsfiddle.net/ebiewener/kSpjh/7/

Upvotes: 0

Joe
Joe

Reputation: 82594

Example: http://jsfiddle.net/kSpjh/4/

using left: 10px; right: 10px; for #sticker

Upvotes: 2

Related Questions