www.webdeveloper.com
Results 1 to 2 of 2

Thread: Centering a page larger than the Window size

  1. #1
    Join Date
    Oct 2010
    Posts
    4

    Centering a page larger than the Window size

    Hey,

    Im having a bit of an issue with a website im building for a band.

    The band want a site that is 2500 width so that when the page loads you can either scroll roght or left to view the out of screen material...

    i cant find a way of the page loading centered...it is always loading to the far left and all i can do is scroll right...i have uploaded the site to http://www.testingserver.comuv.com

    I origionally posted this thread in the CSS forum but was instructed this would be a Javascript issue

    Any help with this would be really appreciated as i cant find any other threads on this specific issue.

    thanks very much.

  2. #2
    Join Date
    Jun 2004
    Location
    Portsmouth UK
    Posts
    2,689
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <style type="text/css">
    /*<![CDATA[*/
    #vocals {
    	background-image: url(Images/vocals%20BG.png);
    	height:200px;
    	width: 2500px;
    	overflow: auto;
    	left: 0%;
    }
    
    /*]]>*/
    </style></head>
    
    <body>
    <div id="vocals" ></div>
    <script type="text/javascript">
    /*<![CDATA[*/
    
    function zxcWWHS(){
     if (window.innerHeight) return [window.innerWidth-10,window.innerHeight-10,window.pageXOffset,window.pageYOffset];
     else if (document.documentElement.clientHeight) return [document.documentElement.clientWidth-10,document.documentElement.clientHeight-10,document.documentElement.scrollLeft,document.documentElement.scrollTop];
     return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTop];
    }
    
    window.scrollTo((document.getElementById('vocals').offsetWidth-zxcWWHS()[0])/2,0);
    /*]]>*/
    </script></body>
    
    </html>
    Vic

    God loves you and will never love you less.

    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles