Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Nov 2003
    Posts
    7
    Member #
    4019
    i am telling the browser to find the matching screen.width in order to use the correct .css file......but, i also need the logo on the page (of which i have different sized versions) to figure what screen.width it is at and load the logo into a css div accordingly.....

    so before i go wasting another 24 hours trina figure it out, maybe someone has done it before, or has some ideas.

    thanks in advance

  2.  

  3. #2
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    Math is your friend here. Either do it as a switch or as a formula.

    As a switch:
    Code:
    <script>
    switch (floor(screen.width/200)) {
        case 3:
            // 600 to 800 pixels
            logo = 'logo_0600.gif';
            break;
        case 4:
            // 800 to 1000 pixels
            logo = 'logo_0800.gif';
            break;
        case 5:
            // 1000 to 1200 pixels
            logo = 'logo_1000.gif';
            break;
        case 6:
            // 1200 - 1400 pixels
            logo = 'logo_1200.gif';
            break;
        case 7:
            // 1400 - 1600 pixels
            logo = 'logo_1400.gif';
            break;
        default:
            // 1600 + pixels
            logo = 'logo_1600.gif';
    }
    </script>
    As a formula:
    Code:
    <script>
    screenWidth =  {screen.width <= 1600) ? screen.width : 1600;
    logo = 'logo_' +  (floor(screenWidth/200) * 200) + '.gif';
    </script>
    Same result either way. You can also change your proportions for every 400 pixels or whatever you want... and you can change your max resolution supported, also.

  4. #3
    Junior Member
    Join Date
    Nov 2003
    Posts
    7
    Member #
    4019
    quiet new to this...how would i implement this formula...?

    i am guessing i initialize the function in <head> then as the <body> loads the function is executed...

    so far i understand the following steps;

    1. define function in <head>
    2. execute function in <body>
    3. ????....would like to know how to tell javascript which
    div it should end up in.....and where the logo is located.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Search tags for this page

ajax load javascript if screen width changes

Click on a term to search for related topics.
All times are GMT -6. The time now is 09:10 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com