Ahmet Tanakol
Ahmet Tanakol

Reputation: 899

Positining elements according to browser size

I have a question about positining elements on the screen. When I start my program, it calculates the browser's width and half of the height. I do it only at the beginning. So my horizontal scroller stands at the center, but when I change the browser size during program run, of course it doesn't stand at center. How can I do that?

My calculation of width and height:

  function GetWidth()
{
      var x = 0;
      if (self.innerHeight)
      {
              x = self.innerWidth;
      }
      else if (document.documentElement && document.documentElement.clientHeight)
      {
              x = document.documentElement.clientWidth;
      }
      else if (document.body)
      {
              x = document.body.clientWidth;
      }
      return x;
}
function GetHeight()
{
      var y = 0;
      if (self.innerHeight)
      {
              y = self.innerHeight;
      }
      else if (document.documentElement && document.documentElement.clientHeight)
      {
              y = document.documentElement.clientHeight;
      }
      else if (document.body)
      {
              y = document.body.clientHeight;
      }
      return y;
}

Upvotes: 0

Views: 88

Answers (2)

oezi
oezi

Reputation: 51797

use the onresize-event to readjust your gui.

function resize() {
  // do something here
}

window.onresize = resize;

Upvotes: 1

Lemex
Lemex

Reputation: 3794

Hopefuly this will help you: Media Queries CSS

Have a read about these, its what i use to display and control my content between mobiles,tablets and desktops.

Its very hand and easy to use.

Upvotes: 1

Related Questions