Hello all.
Created a main tester page.
http://www.danielamorescalchi.com/coreCorp/index.php#
at the bottom right corner i put in a button (orange w/star(for now)) so if the user clicks on it the footer comes up.
works but it disrupts the rest of the layout.
How do I change this so the footer slides up w/out everything else moving?
I thought at first of changing the height of the core of the page and the position of the wrap’s background image (no dice)
or giving the footer a dif z-index. (doubt it)
Can you folks advise on how to fix it or point me to a good tutorial?
Thx
D
You might be able to try setting the background-attachment property for the background-image on the #wrap div. This is positioned to the bottom of #wrap at the moment, if it were set to fixed it shouldn’t move when the footer is expanded.
e.g.
#wrap {
background-image: url('img/oilPlat02.png');
background-repeat: no-repeat;
background-position: bottom left;
[COLOR=#ff0000] background-attachment: fixed;[/COLOR]
}
The other solution would be to move the Footer and the Div containing the menu below the #wrap div
e.g.
<div id="wrap">
<!-- all your stuff -->
</div>
<div>
<a id="toggle" ...>...</a>
<div> <!-- menu --> </div>
</div>
<footer>
<!-- footer -->
</footer>
Thank you for the advice.
Will go try it out and report!
Have a great day.