/    Sign up×
Community /Pin to ProfileBookmark

Plz hlp with layers

Copy linkTweet thisAlerts:
Nov 22.2005

Hi, i want to change the width and height of this layer if the user have 800×600 resolution or if he have 1024×768

[CODE]<div style=”position:absolute;width:760 height: 420;”> [/CODE]

Anyone can hlp me do it?

THX

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@KorNov 22.2005 — [code=php]
<script type="text/javascript">
//set below the div's size [for800x600,for1024x768]
var w=[760,1000];
var h=[420,680];
onload=function(){
var rezW=window.screen.width;
var obj = document.getElementById('mydiv');
obj.style.width=(rezW<1024)?w[0]+'px':w[1]+'px';
obj.style.height=(rezW<1024)?h[0]+'px':h[1]+'px';
}
</script>
...
<div id="mydiv" style="position:absolute;width:760 height: 420;"></div>
[/code]
Copy linkTweet thisAlerts:
@katasovaauthorNov 22.2005 — thx a lot it worked fine but i have this problem... I use several scripts to give full functionality to the page, if i dont put ur script at the very end of all my scripts it dont work...

this is what i mean:

this works fine...
[CODE]
<script language="JavaScript" type="text/javascript" src="misIncludes/Menus/menu_scr.js"></script>

<script type="text/javascript">
//set below the div's size [for800x600,for1024x768]
var w=[450,625];
var h=[0,450];
onload=function(){
var rezW=window.screen.width;
var obj = document.getElementById('mydiv');
obj.style.width=(rezW<1024)?w[0]:w[1];
obj.style.height=(rezW<1024)?h[0]:h[1];
}
</script>

[/CODE]

this wont work...

[CODE]
<script type="text/javascript">
//set below the div's size [for800x600,for1024x768]
var w=[450,625];
var h=[0,450];
onload=function(){
var rezW=window.screen.width;
var obj = document.getElementById('mydiv');
obj.style.width=(rezW<1024)?w[0]:w[1];
obj.style.height=(rezW<1024)?h[0]:h[1];
}
</script>

<script language="JavaScript" type="text/javascript" src="misIncludes/Menus/menu_scr.js"></script>

[/CODE]

do u know why is this happening?
Copy linkTweet thisAlerts:
@ctozNov 23.2005 — you could try a different route: after any css in the head section use js to call a stylesheet specifically for 800x 600 ( or whatever):

<script type="text/javascript">

if (screen.height<768) {document.write('<link rel="stylesheet" type="text/css" href="small.css">') }

</script>
Copy linkTweet thisAlerts:
@KorNov 23.2005 — 
do u know why is this happening?
[/quote]
I guess that your menu_scr.js uses [B]onload[/B] event as well. But in a page there must be a single [B]onload[/B] event, so you may try this:

Write the resize code into a function
[code=php]
<script type="text/javascript">
function resizeDiv(){
var w=[450,625];
var h=[0,450];
var rezW=window.screen.width;
var obj = document.getElementById('mydiv');
obj.style.width=(rezW<1024)?w[0]:w[1];
obj.style.height=(rezW<1024)?h[0]:h[1];

}
</script>
[/code]

then search in menu_scr.js where the onload event trigger the start function. There must be something like

onload = somefunction

or

window.onload = somefunction

Now re-write that line as below:

onload = function(){

somefunction();

resizeDiv()

}

It might be possible the onload to be placed in body. In this case simply add your function

<body onload="somefunction();resizeDiv()">
×

Success!

Help @katasova spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...