1 Reply Latest reply on Jan 15, 2009 12:57 PM by kglad

    Scalable Background image + Centered content

    stevensunsunsun

      I recently found a great tutorial for making a scalable background image on:

      http://blog.fryewiles.com/design/07-14-2008/proportional-image-scaling-in-full-browser-fla sh

      ...which has worked a treat. But my content is now positioned top left.

      How can I centre it without effecting the background?????

      The full code I'm using on the first frame is below. I can centre all the content by changing Stage.align to "T", but then the background image has a nasty white space on the left hand side when the user resizes the browswer.

      I'm a flash newbie, can do some basics, but in need of some help! Thank you all in advance!!


      //set stage for FBF
      Stage.align = "TL";
      Stage.scaleMode = "noScale";

      //define dynamic aspect ratios
      picHeight = new Object ();
      picHeight = pic._height / pic._width;

      picWidth = new Object ();
      picWidth = pic._width / pic._height;

      //conditional statement to account for various initial browser sizes and proportions
      if ((Stage.height / Stage.width) < picHeight) {
      pic._width = Stage.width;
      pic._height = picHeight * pic._width;
      } else {
      pic._height = Stage.height;
      pic._width = picWidth * pic._height;
      };


      //center picture on stage
      pic._x = Stage.width / 2;
      pic._y = Stage.height / 2;


      // create listener
      sizeListener = new Object();

      // make listener change picture size and center picture on browser resize
      sizeListener.onResize = function() {

      if ((Stage.height / Stage.width) < picHeight) {

      pic._width = Stage.width;
      pic._height = picHeight * pic._width;
      } else {
      pic._height = Stage.height;
      pic._width = picWidth * pic._height;
      };

      pic._x = Stage.width / 2;
      pic._y = Stage.height / 2;

      }

      //add listener to stage
      Stage.addListener(sizeListener);