I have very little experience with Ajax, but I have a problem that I think I can use Ajax to solve.  I have a website with a design that is a compromise between the designer and me.  The designer is used to designed for paper, primarily magazine covers, and I'm trying to educate her on the dynamic nature of the web.  This compromise design will work if I can change some settings based on the browser's window size, and ratio (wide screen or not). 

I can get the initial screen size, but is there a way, using ajax, to determine if the screen size has changed?

Diane 

There's a window.onresize event you could handle in JavaScript, e.g.

<script language="javascript" type="text/javascript">
window.onresize = SizeChanged;
function SizeChanged()
{
    alert("You resized me!");
}
</script>

I need to know server size if the browser has been resized, so I can make changes there.  Is there a way to use Ajax?  Have the window.onresize event trigger an event on the server?

Diane 

Hi Diane, What do you mean by 'server size'? When the onresize event is triggered, the handler is passed an event object that contains the new dimensions of the browser window. You can then reformulate your elements as required. The event object is also passed to other events, including onload, so you can set your elements based on the browser windows load state. Rich

Um, change that to server side.  Any changes I make will be made server side.  I need to either trigger a sub or populate server side variables whenever the browser is resized.

I do check the browser size when the browser is first loaded, but my server side code has no way of knowing when the browser is resized.

Diane 

I think the solution kind of depends on what it is you're doing on the server side. It could that you could achieve the same just on the client in Javascript or maybe use an UpdatePanel and trigger its postback in the resize handler.

Ok, the update panel and trigger sounds promising, but I know next to nothing about Ajax.  How could I use an update panel and a tigger to do this?

Diane 

Mainship:

The designer is used to designed for paper, primarily magazine covers, and I'm trying to educate her on the dynamic nature of the web. 

 

I first try to educate the designer about html, html elements and especially cascading style sheets (css). It's possible to build nice pages which resolution independent using pure css. Check out the web, there are tons of good pages dealing with css (show this to the designer for example: css Zen Garden: The Beauty in CSS Design)

For using updatepanel and timer check out the video tutorials on this site (http://www.asp.net/learn/ajax-videos/)

Handling the window onresize event server side (using pagemethods or updatepanel) is not a good idea, because that could yield thousand events (if the user set show window content during resizing/moving).

 

I have been trying to educate both the designer and my customer.  It's going to take a while, meanwhile the site design is a compromise.  The designer thinks she knows about html, html elements, and css.  At least she now realizes she has a lot to learn and she is trying.

Depending on the size/ratio of the users browser window, my customer wants different pieces of the site to be different sizes.  In some cases, she wants pictures to be larger when pages would look too empty.  In other cases, somethings should be smaller only if necessary so they fit.

At this point, the site design is not changing.  I'm just trying to do the best I can with it.  Knowing if/when the browser has been resized would be a definite plus.

Diane
 

Mainship:

Knowing if/when the browser has been resized would be a definite plus.

 

For this you can attach a function to the window.onresize event using javascript (example: http://developer.mozilla.org/en/docs/DOM:window.onresize)

In the function you can do various things:

- using page methods/web services to get dynamic content (this is the fastest and most responsive to the user) 

- put the window height/width in hidden field and force a full or partial postback: in the postback you get the values in the server side

- put iframes everywhere and "active" the frames if there is enough room