Change position of site depending on screen resolution?

[NineTwoZero]

Havent been here for a long time, might as well give it a shot.

I need something that "changes" the top: 0px (1024) to top: 50px;(1280) is it possible? might've been a lil unclear..

[mburt]

This may work:

<script type="text/javascript">
window.onload = function() {
  if (window.screen.availWidth > 1024) {
    document.getElementById("myelement").style.top = "50px";
    }
};
</script>

Report back if there's any problems.

[NineTwoZero]

This may work:

<script type="text/javascript">
window.onload = function() {
  if (window.screen.availWidth > 1024) {
    document.getElementById("myelement").style.top = "50px";
    }
};
</script>

Report back if there's any problems.

u helped me last time i was here too :] ima try it.
i woulda showed the site if it was up.. ill up it right now so you can see it

-----------------------------------------------------

didnt work, put it right under the body tag (was prolly wrong)


----------------------------------

http://920.clan.pro

i think it woulda be a lot easier with 2 different styles depending on resolution..

[boogyman]

you didn't follow his code... and I dont think he accounted for someone with a screen with of exactly 1024x800.

<script type="text/javascript">
// <![CDATA[
window.onload = function() {
  if (window.screen.availWidth <= 1024) {
    include "<link type='text/css' rel='stylesheet' href='1024.css' media='all' />"
 }
 else {
    include "<link type='text/css' rel='stylesheet' href='1260.css' media='all' />" />
  }
}
// ]]>
</script>

copy and paste that into your file, and be careful about the punctuation on the includes.... just change the file name for the two css script pages.

also I suggest getting rid of the frameset it really isn't doing anything with your page.

[NineTwoZero]

you didn't follow his code... and I dont think he accounted for someone with a screen with of exactly 1024x800.

<script type="text/javascript">
// <![CDATA[
window.onload = function() {
  if (window.screen.availWidth <= 1024) {
    include "<link type='text/css' rel='stylesheet' href='1024.css' media='all' />"
 }
 else {
    include "<link type='text/css' rel='stylesheet' href='1260.css' media='all' />" />
  }
}
// ]]>
</script>

copy and paste that into your file, and be careful about the punctuation on the includes.... just change the file name for the two css script pages.

also I suggest getting rid of the frameset it really isn't doing anything with your page.

thanks.. gon try it out directly. frameset aint "mine", its the urls lol. check http://920.ninetwozero.com <-- original, just needed a catchy name for it lol


-----------------------------------------------------
didnt work. :/

[mburt]

The style sheets have to exist, though. Make sure they are valid source (href) names.

[djr33]

This should not have been posted in the PHP section. Moving to Javascript now.

[NineTwoZero]

the styles do exist. but it aint loading none when i use the code..

[NineTwoZero]

alright i created my own script, it doesnt switch though.. only loads the 1024 style. (i put a white background on the 1280 just to make sure that id notice if 1280 was loaded).

var mini = 1024;
var big = 1280;

if ('document.width == mini') {

document.write('<link rel="stylesheet" type="text/css" href="1024.css" />'); 

}
else	{

document.write('<link rel="stylesheet" type="text/css" href="1280.css" />');
}

im loadin it through <script src="SCRIPTNAME.js" />

-----------------------------------------------------------------------
any suggestions? :]

[mburt]

document.width isn't a valid property:

var mini = 1024;
var big = 1280;

if (window.screen.availWidth == mini) {

document.write('<link rel="stylesheet" type="text/css" href="1024.css" />'); 

}
else	{

document.write('<link rel="stylesheet" type="text/css" href="1280.css" />');
}

That should work.