| View previous topic :: View next topic |
| Author |
Message |
Witty Dolphin
Joined: 30 Sep 2009
Posts: 2
|
 Posted: Wed Sep 30, 2009 8:41 am Web Design Size |
 |
|
|
Hi All, I am so glad that I came upon this site. I really need the following information please. I have design a site on my computer size screen: 1280x1024, the client want the site to be smaller so that she don't have to scroll to the right all the time. I have done some research on the net and there are source codes that I can download they call it Screen Display Controllers meaning that the site would adjust to any person's screen size. I have no idea what to change in the source code for it to work propperly. Could anyone please assist me? I need a code for my site's which I design on my size screen to adjust to the client's screen size.
Regards
Susan Venter |
|
sticks464
Joined: 31 Dec 2006
Posts: 2906
|
| Posted: Wed Sep 30, 2009 1:51 pm |
|
|
|
| If you supply a link or post your code someone will gladly assist you. |
|
Witty Dolphin
Joined: 30 Sep 2009
Posts: 2
|
| Posted: Thu Oct 01, 2009 4:27 am HTML Codes I have |
|
|
|
Here are the 3 code examples I have.
1. 1. Copy the coding into the HEAD of your HTML document
2. Add the onLoad event handler into the BODY tag
3. Put the last coding into the BODY of your HTML document -->
<!-- STEP ONE: Paste this code into the HEAD of your HTML document -->
<HEAD>
<script type="text/javascript">
<!-- Begin
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com
Created by: liveing sacrifice :: http://ls-design.forthelads.net */
function resize()
{
var wide = window.screen.availWidth
var high = window.screen.availHeight
var maxh = 600 // your max height here; enter 0 if not used
var maxw = 600 // your max width here; enter 0 if not used
var content = document.getElementById('content')
content.style.position = 'absolute'
if(maxh > 0 && high <= maxh)
{
content.style.height = high
}
if(maxw > 0 && wide <= maxw)
{
content.style.height = high
}
if(maxh > 0 && high > maxh)
{
content.style.height = maxh
high = (high - maxh) / 2
content.style.top = high
}
if(maxw > 0 && wide > maxw)
{
content.style.width = maxw
wide = (wide - maxw) / 2
content.style.left = wide
}
// Do not remove line below
content.innerHTML = content.innerHTML + "<p style='position:absolute;top:95%;width:40%;left:30%;'>provided by: <a href='http://ls-design.forthelads.net'>liveing_sacrifice</a></p>"
}
//-->
</script>
</HEAD>
<!-- STEP TWO: Insert the onLoad event handler into your BODY tag -->
<BODY onLoad="resize()">
<!-- STEP THREE: Copy this code into the BODY of your HTML document -->
<div id="content">
<p>
All your content would go here.</p>
</div>
<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
<!-- Script Size: 1.87 KB -->
The seconde one:
<script language="Javascript"><!--
// ***********************************************
// AUTHOR: WWW.CGISCRIPT.NET, LLC
// URL: http://www.cgiscript.net
// Use the script, just leave this message intact.
// Download your FREE CGI/Perl Scripts today!
// ( http://www.cgiscript.net/scripts.htm )
// ***********************************************
// for NN4/IE4
if (self.screen) {
width = screen.width
height = screen.height
}
// for NN3 w/Java
else if (self.java) {
var javakit = java.awt.Toolkit.getDefaultToolkit();
var scrsize = javakit.getScreenSize();
width = scrsize.width;
height = scrsize.height;
}
else {
// N2, E3, N3 w/o Java (Opera and WebTV)
width = height = '?'
}
document.write("Your Screen Resolution is set to: "+ width +"×"+ height)
//-->
</script>
The Third one:
...
<head>
<?
if(isset($_COOKIE['screenresolution'])) {
//cookie found!
$screenres = $_COOKIE['screenresolution'];
} else {
//cookie is not found, so set it with JavaScript
?>
<script language="javascript">
<!--
writeCookie();
function writeCookie() {
var enddate = new Date("December 31, 2060");
document.cookie = "screenresolution="+ screen.width +"x"+ screen.height + ";expires=" + enddate.toGMTString();
window.location.replace("<?= $_SERVER['PHP_SELF'] .'?'.$_SERVER['QUERY_STRING'] ?>");
}
//-->
</script>
<?
}
?>
</head> |
|
sticks464
Joined: 31 Dec 2006
Posts: 2906
|
| Posted: Thu Oct 01, 2009 5:41 am |
|
|
|
Javascript trickery is not the way to go. Using css to create a fluid layout that adjust to screensize is.
What happens to users that surf with javascript turned off?
Posting html/xhtml and css or a link will get you help in the right direction. |
|
leahmarie
Joined: 04 Aug 2009
Posts: 76
|
| Posted: Sun Oct 25, 2009 9:49 pm |
|
|
|
| sticks464 wrote: |
Javascript trickery is not the way to go. Using css to create a fluid layout that adjust to screensize is.
What happens to users that surf with javascript turned off? |
I agree on this one. I seldom use javascript on this sort of things. I usually use CSS for my screen size and other appearance factor on the site. |
|
dalescratchie
Joined: 13 Oct 2009
Posts: 2
|
| Posted: Tue Nov 10, 2009 9:04 pm |
|
|
|
| Good tips are to host your images on another domain to where the html is located. It increases the amount of simultaneous requests that can be made to download content which, in most browsers, is limited to a maximum of 2 simultaneous connections to each domain name. |
|
charlieangles
Joined: 12 Feb 2010
Posts: 3
|
| Posted: Tue Feb 16, 2010 5:16 am |
|
|
|
| Excellent Tips given in this article in order to design the perfect window size while designing the web site. I want to make a new web site. I hope these tips will really help me in designing the website. |
|
leon match
Joined: 03 Mar 2008
Posts: 14
|
| Posted: Tue Mar 02, 2010 12:57 pm |
|
|
|
Hello,
I was searching the forum with the same question.
I have a website, which is buid for 1200px resolution.
Therefore it does not center on 980px monitors
Please have a look:
www.topsite10.com
From the answers above, could you please give me a clear answer on what should be done in my CSS and HTML to correct it?
Thank you. |
|
charlesying
Joined: 24 Apr 2010
Posts: 1
|
| Posted: Sat Apr 24, 2010 4:20 am hi |
|
|
|
| you should use liquid layouts as these layout spans the entire page width wise, expanding and contracting as the page is resized |
|
Twyla
Joined: 12 May 2010
Posts: 8
Location: BF Califorlornland
|
| Posted: Sat May 22, 2010 6:50 pm |
|
|
|
You can always try the "dirty little tricks" I have going on my main page (see link in siggie). Pure CSS and no Java!
I don't drink the beans and I don't use the scripts. |
|
|
HTML Help Forum
FAQ
Search
Memberlist
Register
Profile
Log in to check your private messages
Log in
