actually the entire site does scroll, but the header and the footer are statically positioned to remain in place. The text fading is achieved with having a semi-transparent image overlayed in that area.
really nice layout, I like
Computer Science Canada CSS Scrolling Inquiry |
| Author: | ryankop [ Mon Oct 16, 2006 8:46 pm ] |
| Post subject: | CSS Scrolling Inquiry |
Hey, I'm building my site here.. however I saw something really cool which was done on another site and I want to incorporate on my site. It's 2 things really. I looked at the site http://www.indigofield.com and if you use firefox or something and scroll down using the main scrollbar (may have to resize the screen smaller) an interior div container scrolls down not the whole site. Another cool thing is when it hits either the bottom or the top of the blog area the text fades. Anyone know how they did it? Thanks Ryan[/url] |
|
| Author: | Tony [ Mon Oct 16, 2006 9:06 pm ] |
| Post subject: | |
actually the entire site does scroll, but the header and the footer are statically positioned to remain in place. The text fading is achieved with having a semi-transparent image overlayed in that area. really nice layout, I like |
|
| Author: | ryankop [ Mon Oct 16, 2006 10:02 pm ] |
| Post subject: | |
Yea I was assuming that also. Know the syntax to make a background to a div container stationary? Also think it'd be possible to make my navbar stationary too? I almost want only one part moving when it scrolls. |
|
| Author: | ryankop [ Mon Oct 16, 2006 10:03 pm ] |
| Post subject: | |
Oh woops, forgot to also ask. What'cha mean by semi-transparent? That I don't quite understand how that is done image-wise or css wise. |
|
| Author: | Tony [ Mon Oct 16, 2006 10:18 pm ] | ||
| Post subject: | |||
from the site itself
the semi-transparent image is http://www.indigofield.com/images/fade_out.png basically just a png with transparancy turned on, and a layer solid colour set to be semi-translusent (different % will have different effects) |
|||
| Author: | rdrake [ Mon Oct 16, 2006 10:32 pm ] |
| Post subject: | |
Very nice layout. Sadly it doesn't render nearly correctly in Internet Explorer. Not like anybody cares about IE anymore anyways  . |
|
| Author: | ryankop [ Tue Oct 17, 2006 4:18 pm ] |
| Post subject: | |
Hmm.. trying to implement something similar into this site of mine. Can't exactly get it to work though. I have the sidebar position's locked and working fine, the header/footer sort'of working (can't get the lines properly below or above them), also some difficulty with the text, since it goes past the footer, and I want it to be cut off past the footer. Does anyone wanna help me? If so, pm me. Thanks a lot you guys! |
|
| Author: | Tony [ Tue Oct 17, 2006 6:28 pm ] |
| Post subject: | |
ryankop wrote: some difficulty with the text, since it goes past the footer, and I want it to be cut off past the footer.
Place the footer lower. Anything pass the footer should be off the page. |
|
| Author: | ryankop [ Tue Oct 17, 2006 8:12 pm ] |
| Post subject: | |
Oh gotcha gotcha. Some reason I can't auto margin it to the bottom though... so if I resize the window it auto margins left, right, and bottom. Weird. Also my lines are now all messed... |
|