changing size of web page

User 8287581

Is it possible to change the size of entire website?? I am trying to do this to support users display resolution by changing size of my web page. for e.g if resolution is 1280X1024, then width=100% and height =100%. This setting as it was made for this resolution. if resolution is 1024X768, then width=90% and height=100%; and other settings. Is it possible to do it using javascript or any other language??? If yes then please post the code Thank you for your help :)

AspDotNetDev

Yes, you can change the dimensions of an HTML element using JavaScript. It would go something like this:

document.getElementById("someDiv").style.width = "700px";

Here is an example of how I have done it with an image: http://aspdotnetdev.com/DevPortfolio/FullscreenImage.aspx?ImageID=10 That's a little different than setting the size of a DIV, for example, because I used the width/height property on the image rather than the width/height property on the style of the image. Still, that should give you a good idea of how to resize webpage elements when the window size changes. Now, if you are talking about changing the size of each element on a page, that would be much tricker. For that, just rely on the user to adjust their zoom level when viewing webpages.

Somebody in an online forum wrote:

INTJs never really joke. They make a point. The joke is just a gift wrapper.

Dennis E White

take a look at - http://adapt.960.gs/ I wrote an article about using it in a jQuery plugin. Here is a link to it - A jQuery plugin for an Adaptive 960 Grid System. best of luck.. :)

davidshenba

myHeight = window.screen.height; //this gives screen height
myWidth = window.screen.width; //this gives screen widht

If you want to find only the usable area (space that remains after taskbar etc) use "availHeight" and "availWidth" So you can have various CSS classes for the various screen resolutions and by checking user's resolution you can change them on the fly! CSS:

.class1024 {
color : "green";
}
.class800 {
color : "blue";
}

JavaScript:

if(myWidth == 1024) {
elem.className='class1024';
}
else if (myWidth == 800) {
elem.className='class800';
}

Hope this helps!

-Shenbaga Murugan Paramasivapandian I hate computers and I just mess them up with my code!

User 8287581

I tried but it did not work :(. I tried it in this way

var ScreenWidth=screen.width;
var ScreenHeight=screen.height;

if(ScreenWidth=="1280"&&ScreenHeight=="1024")
{document.getElementById("body").style.width = "10%";
}

</script>

where I tried to apply it to the boy and

var ScreenWidth=screen.width;
var ScreenHeight=screen.height;

if(ScreenWidth=="1280"&&ScreenHeight=="1024")
{document.getElementById("outer").style.width = "10%";
}

</script>

Here body is the body and outer is the outermost wrapper div which I have Plz help

Dennis E White

really need to see the whole thing. it could be various problems causing the problem. maybe another css dynamically updating the content or worse yet your code not running properly??

as if the facebook, twitter and message boards weren't enough - blogged

User 8287581

its extremely huge should I post everything including all the exisitng js?

Dennis E White

maybe not. what I would recommend instead then is breaking this up into its own example (but still full js and html) and working with it from there. I have found it best to isolate problems this way when the total solution has a lot of other "stuff" happening. in debugging this my first assumption is that you javascript just isn't executing or isn't executing completely. after that I would assume that some sort of css rendering is interfering with what you are trying to do. plus the other bonus in breaking it up into a small and complete solution is that you can post it back to a question forum when you have tried everything.

as if the facebook, twitter and message boards weren't enough - blogged

Morgs Morgan

Hi there, I like your intention that you would like to manually change website size after knowing the user's screen dimensions, but hey! that is simply a waste of time and might make u write 1000s lines of code which might actually not work on every computer. A properly designed website will at most resize itself when rendered by a browser. Mostly all you need is to set the width of the outter content (div) to say: width:960px; Don't set the height, let the browser decide how much your web page will grow downwards. Honestly speaking, it's messy to rely on your clients resolution to determin your page display layout. In my designing, i just design one site with one set dimension and that's it! the rest will sort itself on client-side without any javascript/jQuery involved. Happy designing, Morgs