How to change the screen based on the Screen size or any other alternative

[kamal_khadka]

Based on the screen size we want to display the webpage. For small screen (smart phones) we only want to show login and services we provide. For medium screen (tablet screen) we want to show more information compared to small screen. It will have a line of summary of services.

With larger screen we want to display details description, pics

We are using facelets, Richfaces, and seam.

How should this be done.

Any idea suggestions or any other easier alternative will be very helpful.

[amitev]

You can get the screen resolution only with javascript and send it to the browser. The code would look something like this

<script type="text/javascript">
if ((screen.width<=800) && (screen.height<=600)) {
 window.location.replace('http://example.com/800-600-or-less');
}
else {
   window.location.replace('http://example.com/greater-than-800-600');
}
</script>