3 Replies Latest reply on May 28, 2008 10:10 PM by Gregory Lafrance

    Background image stretching

    jaldag1
      I've set my background to display an image but it doesn't scale correctly when the browser is maximized. I'm trying to find a way to keep the correct ratio even if the image looks cropped.

      -Jason
        • 1. Re: Background image stretching
          Doc816
          You can set the backgroundSize property of most containers:

          The property: Scales the image specified by backgroundImage to different percentage sizes. A value of "100%" stretches the image to fit the entire component. To specify a percentage value, you must include the percent sign (%). The default for the Application container is 100%. The default value for all other containers is auto, which maintains the original size of the image.
          • 2. Re: Background image stretching
            jaldag1 Level 1
            Hi Doc, thanks for the reply. I've actually tried both of those options, but with 100% the picture continues to stretch the image so that the people look fatter. Auto is way too big. Is there a way to keep the ratio regardless of the browser size?
            • 3. Re: Background image stretching
              Gregory Lafrance Level 6
              Just set the backgroundSize to any value that is not a percentage. If the following code, I can set the backgroundSize to 600 (actual width of image), or to 2000, 1, etc. it doesn't matter. The background image always displays at its actual size and aspect ratio is maintained when browser is resized.

              <?xml version="1.0"?>
              <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
              backgroundImage="images\france_agriculture.jpg" backgroundSize="600">

              </mx:Application>