ChatterBank1 min ago
how is this website working
7 Answers
Hi
I am trying to achieve a similar effect as this website. When you make the browser smaller the bg image moes slightly to the left so that the glowing pathway bit moves to the left as well but as soon as it hits the left sie it stops moving left.
now it is not an image but is set as a bg tag. i cannot for the life of me get the same effect. anyone help me.
plus i would sooo love to be able to program it so that i have a div tag (or whatever it is that does it to move the same amount to the left.. as you see the nav strip and text do so that everything alsways moves together with the BG image.
please help.. here is the site i am talking about. please also bear in mind i am a big novice in css coding and html in your explainations if you can help
ok here is the site http://www.monumedios.com.ar
thanking in advance
I am trying to achieve a similar effect as this website. When you make the browser smaller the bg image moes slightly to the left so that the glowing pathway bit moves to the left as well but as soon as it hits the left sie it stops moving left.
now it is not an image but is set as a bg tag. i cannot for the life of me get the same effect. anyone help me.
plus i would sooo love to be able to program it so that i have a div tag (or whatever it is that does it to move the same amount to the left.. as you see the nav strip and text do so that everything alsways moves together with the BG image.
please help.. here is the site i am talking about. please also bear in mind i am a big novice in css coding and html in your explainations if you can help
ok here is the site http://www.monumedios.com.ar
thanking in advance
Answers
Best Answer
No best answer has yet been selected by mollymoo. Once a best answer has been selected, it will be shown here.
For more on marking an answer as the "Best Answer", please visit our FAQ.we all ask the same question daily!
it's quite pretty
the sparklies are a flash animation
combines with a java overlay
on a background
http://www.monumedios.com.ar/images/fondo.jpg
and these (plus others)
http://www.monumedios.com.ar/swf/1.swf
http://www.monumedios.com.ar/swf/2.swf
http://www.monumedios.com.ar/swf/3.swf
http://www.monumedios.com.ar/swf/4.swf
http://www.monumedios.com.ar/images/1.png
http://www.monumedios.com.ar/images/2.png
http://www.monumedios.com.ar/images/3.png
http://www.monumedios.com.ar/images/4.png
my label
my label
my label
easiest way to see how
is file | save as | and save as webpage complete
you'll get the .html, .js and .css code
which will open in a text editor
the backgrounds are in the .css files
the measurements are a mix of absolute and relative
so
it's quite pretty
the sparklies are a flash animation
combines with a java overlay
on a background
http://www.monumedios.com.ar/images/fondo.jpg
and these (plus others)
http://www.monumedios.com.ar/swf/1.swf
http://www.monumedios.com.ar/swf/2.swf
http://www.monumedios.com.ar/swf/3.swf
http://www.monumedios.com.ar/swf/4.swf
http://www.monumedios.com.ar/images/1.png
http://www.monumedios.com.ar/images/2.png
http://www.monumedios.com.ar/images/3.png
http://www.monumedios.com.ar/images/4.png
my label
my label
my label
easiest way to see how
is file | save as | and save as webpage complete
you'll get the .html, .js and .css code
which will open in a text editor
the backgrounds are in the .css files
the measurements are a mix of absolute and relative
so
jam97 I am very aware of copyright and am not stealing their site. I am asking how they did it cos i have a design idea of my own that would use a silialr setup of how it moves when you resize that is all.. hence why i am asking for the help rather then just grabbin all the code and puttingin my own words....
ok so i got all the files and i still cannot see how the image bg moves to the right then stops... to see what i mean let me try to explain it again...
if you set the browser so you can move it smaller, as you make it smaller you will see that teh bg image moves with it watch the glare/bubble bits move to the left then it stops once the pink glowing stringy bits are on the far left it moves no more.
the pink bits are part of the bg... does this make sense..
thanks
if you set the browser so you can move it smaller, as you make it smaller you will see that teh bg image moves with it watch the glare/bubble bits move to the left then it stops once the pink glowing stringy bits are on the far left it moves no more.
the pink bits are part of the bg... does this make sense..
thanks
if you look at the js code it does say it's free for use ....
the images ... less easy to decide but you have the right attitude
the answer to your question is fixed and relative size/measurement
the screen is set somewhere round 720 pixels with a 50% overlap and margins
so if the screen is over 720 pixels
it keeps it's proportion
below that ... it does the best it can ... but won't go below the absolute left margin so will retain a 50% overlap until the gap is 10px and then the margin freezes so only the right of the screen can move
the images ... less easy to decide but you have the right attitude
the answer to your question is fixed and relative size/measurement
the screen is set somewhere round 720 pixels with a 50% overlap and margins
so if the screen is over 720 pixels
it keeps it's proportion
below that ... it does the best it can ... but won't go below the absolute left margin so will retain a 50% overlap until the gap is 10px and then the margin freezes so only the right of the screen can move
ACtheTROLL thanks for your help glad someone actually replies to questions as they are intended rtaher then to just make stupid comments.
i have been havin a look at the glider.js file and worked out what that relates to very cool effect.
not quite sure what you mean by all the overlaps and stuff.. most of the coding is very new to me. but i think i will have a go in the morning at fiddling around trying to understand your 2nd post and see what results i get.
seeing as you seem to knwo so much i have designed another site i seem to be having issues with in safari.
www.sarahhood.co.uk/movies/about.htm
now if you view it in IE you see the lighter green bg but in safari and firefox it appears as white. i have tried to sort the code but with no luck so if you can see any errors please help.
once again thanks for all your help so far really appreciate it
thanks
mollymoo
i have been havin a look at the glider.js file and worked out what that relates to very cool effect.
not quite sure what you mean by all the overlaps and stuff.. most of the coding is very new to me. but i think i will have a go in the morning at fiddling around trying to understand your 2nd post and see what results i get.
seeing as you seem to knwo so much i have designed another site i seem to be having issues with in safari.
www.sarahhood.co.uk/movies/about.htm
now if you view it in IE you see the lighter green bg but in safari and firefox it appears as white. i have tried to sort the code but with no luck so if you can see any errors please help.
once again thanks for all your help so far really appreciate it
thanks
mollymoo