Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Site Resolution
- Thread starter juruk
- Start date
ChrisHirst
IS-IT--Management
code it using % for widths and it will!!
Chris.
Indifference will be the downfall of mankind, but who cares?
Chris.
Indifference will be the downfall of mankind, but who cares?
- Thread starter
- #3
PaulBricker
Programmer
I use this code to redirect to another page if the screen resolution is less than 1024 x 768. The full code is located at
Paul
Code:
<script language="JavaScript1.2">
<!--
/*
Screen Size Redirect script (By Robert @ [URL unfurl="true"]http://members.tripod.com/technological_tinker/)[/URL]
Submitted to Dynamicdrive.com to feature script in archive
For full source, usage terms, and 100's more DHTML scripts, visit [URL unfurl="true"]http://dynamicdrive.com[/URL]
*/
if (screen.width>=1024||screen.height>=768) //if 1024x768
("[URL unfurl="true"]http://businessoffice.williston.com")[/URL]
else //if all else
window.location.replace("[URL unfurl="true"]http://businessoffice.williston.com/businessofficehpalternate.html")[/URL]
//-->
</script>Paul
I do something along the same lines, except I just pick which style sheet to use, and have the sheets manage the page width.
Each style sheet has a class called "Table". The style sheet for the 1024+ screen resolution has a fixed width in the "table" class, and the other one uses percentages.
So, I just reference the class in my main table, and let the javascript determine which style sheet to use, which determines the total width:
Of course, this is all completely useless if the user has JavaScript turned off, but I work in a controlled environment (Intranet) so I don't have to worry about that.
Hope This Helps!
Ecobb
"My work is a game, a very serious game." - M.C. Escher
Code:
<script>
if (screen.width>1025) {document.write("<link rel=\"STYLESHEET\" type=\"text/css\" href=\"style2.css\">")}
else {document.write("<link rel=\"STYLESHEET\" type=\"text/css\" href=\"style.css\">")}
</script>So, I just reference the class in my main table, and let the javascript determine which style sheet to use, which determines the total width:
Code:
<table class="table">Of course, this is all completely useless if the user has JavaScript turned off, but I work in a controlled environment (Intranet) so I don't have to worry about that.
Hope This Helps!
Ecobb
"My work is a game, a very serious game." - M.C. Escher
- Thread starter
- #6
I would shy away from javascripts for this sort of thing, as many people are opting to turn off javascript, and some browsers simply do not support it.
This site has an easy method of designing a site that will expand or reduce to fit the screen, regardless of resolution or browser. It is a bit archaic in that it relies on tables.
There are ways to accomplish this using CSS also, but that will take more knowledge on your part of CSS. I don't know of a tutorial off hand that explains that in detail.
When in doubt, deny all terms and defnitions.
This site has an easy method of designing a site that will expand or reduce to fit the screen, regardless of resolution or browser. It is a bit archaic in that it relies on tables.
There are ways to accomplish this using CSS also, but that will take more knowledge on your part of CSS. I don't know of a tutorial off hand that explains that in detail.
When in doubt, deny all terms and defnitions.
Also bear in mind that just because my screen is 1024 pixels wide, it doesn't mean my browser will be. One of the reasons for having a high resolution is to allow users to have several apps open and visible at once. I don't have my browser maximised right now, do you?
If you have to do this, a more robust method might be to declare the both stylesheets (one as the default, one as an alternative) and use JS to switch them if required. Use the styleswitcher.js script from and this snippet:
This way you still get a style sheet if Javascript is switched off.
-- Chris Hunt
If you have to do this, a more robust method might be to declare the both stylesheets (one as the default, one as an alternative) and use JS to switch them if required. Use the styleswitcher.js script from and this snippet:
Code:
<html>
<head>
...
<link rel="stylesheet" type="text/css" href="small.css"
title="small" />
<link rel="alternate stylesheet" type="text/css" href="big.css" title="big" />
<script type="text/javascript" src="/js/styleswitcher.js"></script>
<script type="text/javascript">
if (screen.width>1023) {
setActiveStyleSheet('big');
}
</script>
...-- Chris Hunt
- Status
Similar threads