Click to See Complete Forum and Search --> : Jquery sliding divs slide my page to the left
thebigkrumm
02-05-2010, 09:47 PM
Oh. My. Gosh. Stumped again.
I'm using JQuery to slide some DIVs in and out; for some reason, sometimes the sliding will cause my page to shift to the left. It will shift back when I close the div.
See what I mean:
http://www.sarasotapropertygroup.com/shortsale/followup.php
Here's the CSS link I'm using:
http://www.sarasotapropertygroup.com/shortsale/style.css
I suspect it's a padding issue in the hidden DIVs and I don't see it, but I'm not at all sure.
Not seeing the issue. In which browser and version does the problem occur?
thebigkrumm
02-06-2010, 09:03 AM
Tested in both FF 3.6 and IE 8. The problem comes up in both. It won't come up every time, only when multiple sliding divs are open (or when one div with two sideboxes are open.) It makes me think that the issue may be in the class .sideBox, which controls those contents - but it could also be a few other children DIVs. I can't find it, though.
When you navigate to the page, the 'Lienholder Info' DIV is open and everything else is closed. Try closing it (so that all are closed) and reopening it. I think you'll see what I mean.
Can't reproduce the problem
thebigkrumm
02-06-2010, 08:28 PM
Interesting, it shows up in both the browsers I use.
I've narrowed it down a little further :) I've got two floating divs side by side (both float:left, overflow:auto). The columns are housed in a parent container that is margin:auto.
The margin of the parent DIV (which houses the floating DIVs) shifts left about 8px at the exact moment that the right column slides past the bottom of the left column. Its width is constant, even after the page shifts. If I change the margin to a set number (I tried 50px) the problem disappears entirely, and everything works as it's supposed to - with the exception that the page isn't automatically centered.
What could cause a DIV of constant width to shift margins in the browser window?
Hmmm, guess I'm going to sleep on it ... again.
**
What browser are you using that it doesn't show up?
thebigkrumm
02-06-2010, 11:41 PM
Solved the issue, I'm totally an idiot.
The DIV was shifting because as the DIV increased in height, it crossed the threshold where Mozilla would add a scrollbar. When the scrollbar became visible, it naturally shifted my page over ...
Duh.