PDA

View Full Version : Screen Resolution


101
10-18-2002, 05:22 PM
Ok, I have made my site based on the screen resolution 1024 by 768 pixcels.
However i get loads of complaints about how some people have 600 by 800 and can not view
the web site properly.
So i have made a script which when you right click on the page you can zoom in or zoom out.
However i have frames for my web site and so it would get very annoying if they have to that for each frame.
So i have included the zoom in/out script and another script showing if the user clicks a button, what screen resolution
they have. So all i need help with is combining these so that in the body:onload tag in load the script
which checks there resolution and then changes the page accordingly.

Please Note: The scripts may have a few bugs in them

<Script Language=JavaScript>

var isie=0;
if(window.navigator.appName=="Microsoft Internet Explorer"&&window.navigator.appVersion.substring(window.navigator.appVersion.indexOf("MSIE")+5,window.navigator.appVersion.indexOf("MSIE")+8)>=5.5) {
isie=1;
}
else {
isie=0;
}
if (isie) {
var html="";
html+='<SC'+'RIPT LANGUAGE="JavaScript">\n';
html+='\n<'+'!--\n';
html+='window.onerror=null;\n';
html+='/'+' -'+'->\n';
html+='</'+'SCRIPT>\n';
html+='<TR><TD STYLE="border:1pt solid #eeeeee" ID="i8" ONMOUSEOVER="document.all.i8.style.background=\'#CFD6E8\';document.all.i8.style.border=\'1pt solid #737B92\';" ONMOUSEOUT="document.all.i8.style.background=\'#eeeeee\';document.all.i8.style.border=\'1pt solid #eeeeee\';" ONCLICK="if(window.parent.document.body.style.zoom!=0) window.parent.document.body.style.zoom*=1.1111111111111111111111111111111111111; else window.parent.document.body.style.zoom=1.11111111111111111111111;"><FONT FACE=arial SIZE=1>&nbsp;&nbsp;Zoom In</FONT></TD></TR>';
html+='<TR><TD BGCOLOR=888888><IMG SRC="images/pix.gif" WIDTH="1" HEIGHT="1"></TD></TR>';
html+='<TR><TD STYLE="border:1pt solid #eeeeee" ID="i9" ONMOUSEOVER="document.all.i9.style.background=\'#CFD6E8\';document.all.i9.style.border=\'1pt solid #737B92\';" ONMOUSEOUT="document.all.i9.style.background=\'#eeeeee\';document.all.i9.style.border=\'1pt solid #eeeeee\';" ONCLICK="if(window.parent.document.body.style.zoom!=0) window.parent.document.body.style.zoom*=0.9; else window.parent.document.body.style.zoom=0.9;"><FONT FACE=arial SIZE=1>&nbsp;&nbsp;Zoom Out</FONT></TD></TR>';
html+='</TABLE>';
html='<TABLE STYLE="border:1pt solid #888888" BGCOLOR="#eeeeee" WIDTH="160" CELLPADDING="0" CELLSPACING="0">'+html;
var oPopup = window.createPopup();
}

function dopopup(x,y) {
if(isie) {
var oPopupBody = oPopup.document.body;
oPopupBody.innerHTML = html;
oPopup.show(x, y, 160, 33, document.body);
}
}

function click(e) {
if(isie) {
if(document.all) {
if(event.button==2||event.button==3) {
dopopup(event.x-1,event.y-1);
}
}
}
}
if(isie) {
document.oncontextmenu = function() { dopopup(event.x,event.y);return false; }
document.onmousedown = click;
}

</Script>



<Script Language="JavaScript">

function pixcel() {
if (screen.width == 640)
{
document.write("You Have 640 By 480 Pixcel Resolution. Please When You Enter The Main Page Right Click And Click Zoom Out Twice.");
}
if (screen.width == 800)
{
document.write("You Have 800 By 600 Pixcel Resolution. Please When You Enter The Main Page Right Click And Click Zoom Out.");
}
if (screen.width == 1152)
{
document.write("You Have 1152 By 864 Pixcel Resolution. Please When You Enter The Main Page Right Click And Click Zoom In.");
}
if (screen.width == 1280)
{
document.write("You Have 1280 By 1024 Pixcel Resolution. Please When You Enter The Main Page Right Click And Click Zoom In Twice.");
}
else
{
alert("You Have 1024 By 768 Pixcel Resolution. This Means You Don't Have To Do Anything.");
}
}

</Script>

<input type="button" value="Check" name="pixcel" onclick="javascript:pixcel()">

bacterozoid
10-18-2002, 05:48 PM
Lol, that's a heck of a script there. I don't know enough to be able to help you much, but I guess there is the possibility of just telling your users to switch to your larger screen resolution, though the majority of users have 800 by 600, me included.

Having your page like that would require most users to use the zoom feature, and would it stay zoomed on every page? I recommend creating your site for the more constricted, but more used 800 by 600 resolution, which will eliminate a lot of complaints.

Feel free to attempt to do what you wish though, that is just my opinion. Also, if you haven't noticed, your script displays the alert notifying of the accepted screen resolution even if the user doesn't have it.


else
{
alert("You Have 1024 By 768 Pixcel Resolution. This Means You Don't Have To Do Anything.");
}
}


You get that message no matter what your resolution, to fix it you can cange it to another 'if' statement using your height and width specifically to give the alert. Try this:


if (screen.width == 1024)
if (screen.height == 768)
{
alert("You Have 1024 By 768 Pixcel Resolution. This Means You Don't Have To Do Anything.");
}
}


The script will verify both 'if' statements before allowing the alert box.

Sorry I couldn't help you out how you wanted, but I hope my suggestions come in handy somewhere along the line.