If you like at this site you will see the room, using software I have I know the background image used is only of the room. and when you resize your browser all the content stays in place in that “room”
I’m trying to do something like this I am using a background image yet when I place graphic or html boxes over the image and test it in Safari and resize the browser it changes the items to move from the place I placed them over the image…How can I prevent this from happening?
(if you resize your browser using the bottom right corner of Safari the content stays in place on this site… )
I hope I made it clear what I was trying to ask. Thanks in advance for any insight on this.
Roughly speaking, what it appears the site is doing in having everything in a div wrapper, moving that div 50% to the left and down 50%. Then adding half the div’s height and width as a negative margin the the top and left respectively.
This has the net effect of centering the wrapper div in the window regardless of screen size. The brief experiments I have tried in Fw to replicate have come close but failed to easily reproduce.
There are actually two backgrounds involved. The main background of the rooms walls is the actual “background”. The rooms contents is the second background which appears to be what the wrapper settings are for. Will take some experimenting to see what that does.
The javascript library JQuery is also being used for part of this as well.
Sometime around 1/10/08 (at 21:07 -0400) John B said:
I’m trying to do something like this I am using a background image
yet when I place graphic or html boxes over the image and test it in
Safari and resize the browser it changes the items to move from the
place I placed them over the image…How can I prevent this from
happening?
You can reverse-engineer the example and try to work it out in a
complex way, or, if you can live without the vertical centering…
Set your Freeway page alignment to Center, then set the Horizontal
aligment for your background image to Center as well. Both of these
steps are done using the Inspector palette.
Simple, if you can live with just horizontal centering.
The vertical alignment is more complex, but if you choose your
background image and ‘foreground’ content height position well you
can usually pretty much remove the need for this.
(Remember, on very large screens virtually all web pages will have
alignment and space issues.)
thanks Helveticus!!