Tom's Guide | Tom's Hardware | Tom's Games
 |
 |
 |
My new site (http://guy500.atspace.com) changes size depending on the size of the user's screen, and also gives users the chance to choose a larger or smaller text version. This seems to work fine on most browsers (IE, Mozilla, Netscape) - EXCEPT that when the height of the screen is below around 540 pixels, Internet Explorer freezes and closes when attempting to change the size of the text. The other browsers work fine and report no javascript errors or anything. It means that some users on widescreens will have enormous problems with the site on IE. Can anyone throw any light on this and advise me how I can avoid it.
Can you provide some code or something? I don't see any option on your page to change font size.
Michael J
0 
Ah, I see it now int he top right (Larger Version/Smaller Version). I experienced a different bug. If I make my page small and click the Larger Version, part of the top of the page "disappears" up into the top margin.
Michael J
0
Thanks Michael
Actually, it's not a bug that you found. I have designed it so that if the browser window is too short to display the height of all the content, the top section is cut short so that all the main content fits on the screen.
This is the relevant javascript used. It is used to read the screen-size and make adjestments to the page every time an item on the menu is chosen or whenever a different sized version of the site is chosen. To begin with, "choice" is set to ''.
function dimensions(){
scrwid = document.body.clientWidth;
if (navigator.appName == 'Netscape') {scrht = window.innerHeight;}
else {scrht = document.body.clientHeight;}
setcss();
document.getElementById('css').href = css + 'css.css';
if (css == 'main' || css == 'mainshort') {wid = document.body.clientWidth - 785;}
else {wid = document.body.clientWidth - 925;}
if (currentclip == '') {document.getElementById('audio').innerHTML = '<div id = "embedded"></div>';}
if (css == 'large' || css == 'largeshort') {
document.getElementById('embedded').style.width = '725px';
document.getElementById('audio').style.left = '200px';
document.getElementById('nowplaying').style.left = '200px';
}
else{
document.getElementById('embedded').style.width = '595px';
document.getElementById('audio').style.left = '190px';
document.getElementById('nowplaying').style.left = '190px';
}
if (open == "qaa"){
if (css == 'large' || css == 'largeshort') {
document.getElementById('embedded').style.width = '665px';
document.getElementById('audio').style.left = 230 +'px';
document.getElementById('nowplaying').style.left = 230 +'px';
document.getElementById('closeaudio').style.right = wid+30 +'px';
}
else{
document.getElementById('audio').style.left = 205 +'px';
document.getElementById('embedded').style.width = 565 +'px';
document.getElementById('closeaudio').style.right = wid+15 +'px';
document.getElementById('nowplaying').style.left = 205 +'px';
}
}
document.getElementById('closeaudio').style.right = wid + 'px';document.getElementById('right').style.width = wid + 'px';
if (wid > 70){
document.getElementById('guypic').innerHTML = '<br /><div class = "righttext">Me with my fiancee, Oksana</div>';
document.getElementById('guywid').style.width = wid-14 +'px';
document.getElementById('qapic').innerHTML = '';
document.getElementById('qapic').style.top = 5 +'px';
document.getElementById('qapic').style.left = (wid-71)/2 +'px';
if (wid > 110){
document.getElementById('wise').innerHTML = '<input type="button" value="Wise Words" onclick="box()" />';
document.getElementById('wise').style.left = ((wid-95)/2)-7 +'px';
}
else {document.getElementById('wise').innerHTML = '';}if (wid > 160){
document.getElementById('guywid').style.width = 160 +'px';
document.getElementById('guypic').style.left = (wid-160)/2 +'px';
}
else{
document.getElementById('guypic').style.left = 7 +'px';
}
}
else{
document.getElementById('guypic').innerHTML = '';
document.getElementById('wise').innerHTML = '';
document.getElementById('qapic').innerHTML = '';
}
}function setcss(){
if (choice == 'larger'){
if (scrht < 540) {css = 'largeshort';}
else {css = 'largehome';}
return;
}
if (choice == 'smaller'){
if (scrht < 462) {css = 'mainshort';}
else {css = 'main';}
return;
}
if (scrwid > 1100){
if (scrht < 462) {css = 'mainshort';}
else if (scrht < 540) {css = 'largeshort';}
else {css = 'large';}
return;
}
else{
if (scrht < 462) {css = 'mainshort';}
else {css = 'main';}
return;
}
}
0
Well, it may be as designed, but I think there could be a better way of handling it. With the "problem" I experienced I could not get the links back at the top to change the font style back. Many peopl do not run their browsers in full screen and if content/functions are removed because of this it can get frustrating.
It's your site and I wish you all the luck with it, I just think you might be trying to overengineer it a bit. Another approach would be to design the pages so that they will "fit" to whatever size page the user has without having to modify the style properties.
Michael J
0
Yes, I take the point - it is starting to seem a little over-elaborate. (The functionality SHOULD still be there with the shorter screen, though - with the option to change screen-size moved to the top-left of the screen.) Perhaps I should just remove the options for the shorter screens - people can see for themselves if they want to increase the height of the browser to get all the content on the screen....
0
Hello! It is me again. I seach diese programm in Google for you.
Looking in this page - http://aonid.biz/utilities/
It is discont for this programm.
0  |
 |
 |
This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |
