| Alternative to position:fixed (CSS for cross-browser compatability) |
Started by GuitarBoy
20 May 2012 00:32
SUBSCRIBE
UNSUBSCRIBE
|
|
|
|
For my site, NintendOS, I have an element that needs to have a fixed position of bottom:0px; and left:0px;, but sadly I've heard that the 3DS browser does not support fixed positioning (stupidity...tsk tsk).
If I'm correct, 3DSHub had a method for fixed positioning using Java Script.
If you're reading this, could you please get a hold of Skittles for me? He's the one whom made the script.
Thanks in advance!
Success today, greatness tomorrow.
|
Make a MSpaint of it, place it wherever it should be, make buttons, place on paint, input cordnates in a slant going this way to the corners input link in right place, done.
takes a while but works. :3
People are like slinkies. Worthless, but will always bring a smile to your face when you shove them down the stairs.
|
The distinguished Darmani Link spake: Make a MSpaint of it, place it wherever it should be, make buttons, place on paint, input cordnates in a slant going this way to the corners input link in right place, done.
takes a while but works. :3
What? Success today, greatness tomorrow.
|
What i think you should do is make the website scrollable in like an element and not whatever you want to hover.
like...
<style type='text/css'>
mywebsitebody{
display:block;
width:100%;
height:400px;
overflow:auto;
}
</style>
<mywebsitebody></mywebsitebody>
<hoveringelement></hoveringelement>
if you,kno what i mean? the only problem,with this is the scrollbar isnt very good.. maybe i'll make you a,scrollbar?
|
|
How does that make "hoveringelement" stay in the same place?
Success today, greatness tomorrow.
|
|
Because the first element doesnt move. nothing does. you just scroll thd first element. do you understand what i mean?
also you need
<style>
html {
overflow:hidden;
}
</style>
that will remove the scrollbars.
|
|
Again:
How does that make "hoveringelement" stay in the same place?
Success today, greatness tomorrow.
|
|
I just told you -.- i'll make you an example -.-
|
|
|
|
I need it fixed within the box that you scroll.
Success today, greatness tomorrow.
|
|
You can do that with the same thing except use position:relative to position it away from where it currently is. or you can use absolute since the actual website isnt scrolled. its a pretty easy solution rly.
|
|
I don't think you understand what I mean.
I want it to FOLLOW the page when it is scrolled, and relative and absolute positioning won't do crap.
I'm looking for a compatible solution with JS that constantly refreshes the absolute positioning of an element based off of the scroll position of the page.
Success today, greatness tomorrow.
|
|
Uhh bloody hell how small is your iq -.-
|
The distinguished a.smith spake: Uhh bloody hell how small is your iq -.-
Not that low. You don't seem to understand what the differences are between relative and absolute positioning.
Absolute position:
Position an element anywhere on a page. It does not follow as you scroll.
Relative position:
Relative to what would normally be the static (natural) position.
Fixed position:
Position an element anywhere on a page. It DOES follow as you scroll. Success today, greatness tomorrow.
|
|
I know that dumbass -.- i said to use absolute or relative to mmake it APPEAR to hover. the page itself doesnt actually scroll and what you are actually scrolling is just slme element.
like this.
<style>
html{
overflow:hidden;
}
mywebsitehtml{
display:block;
overflow:auto; //this adds the scrollbars.
width:100%;
height:100%;
}
hoveringtext{position:absolute;top:0;}
</style>
<mywebsitehtml>
place your text here
</mywebsitehtml>
<hoveringtext></hoveringtext>
so your element will APPEAR to be hovering at the top. obviously it isnt. the page is never scrolled because the page is inside an element. if you dont get it now im giving up o.O
|
there is a way to do this with Java Script but it involes you having to do this thing where you set a interval and then have it move the image as the page move but i dont know how your doing that
eye3ds.mooo.com
|
|
|
|
