html floats
- Started
- Last post
- 12 Responses
- epigraph
Is there a way to do this:
I have a container div with a width of 100% height of whatever.
Inside are two more divs, left and right.
Left is fixed at 100px, right is fluid and fills up the rest of the container.I want to expand the left div to 300px with some JS and have it push the right div over.
- tFour0
maybe using / calculating with the viewport width?
- 3030
What is the problem? CSS or JS?
- 3030
$(".expander").click(function(){
$("#colLeft").animate({ width: "300px" }, 500);
});
- epigraph0
Most of the two column fluid layouts I have seen use a margin to offset for the static div. Seems like you would have to animate the right div margin as well as the left div width, right?
- epigraph0
Basically the same thing I have now ( when you click on the "open" button), except instead of the div overlaying everything and expanding to 100%, I want it to push the div containing the images over and only expand to 300px.
I'm sure the markup is an abomination so go easy: http://www.jamesguild.com/portra…
- epigraph0
As a follow up, I have figured out how to do what I wanted. It was incredibly simple, but I made my post really complicated =) Thanks for all who put their two cents in.
Here is what I was trying to accomplish:
www.jamesguild.com/newtest- nice sitevaxorcist
- thanks! in the middle of a massive updateepigraph
- Really nice!!Sneakybadger2
- epigraph0
SOO if you you notice when you expand or contract the orange panel, the browser does not recalculate the window size unless you resize the browser window.
Open the panel. resize window. Close panel. You'll see what I mean.
What is the way to make the browser "figure out" window size after the JS animation is executed?
- acescence0
http://www.hesido.com/flexcroll/…
see updating scrollbars