SWF at 100 % width and proportional height

I have a SWF that I would like to use in an XHTML 1.0 Strict document.
My need is that the flash must:
- Be 100% width
- Grow / shrink proportionally in height (depending on width)
- The flash may not be cropped or distorted
- I must be able to to put a div just before the flash
- I must be able to place a div right after the flash
The flash should behave just as if you pasted below image in an HTML file:
<img
style ="
width: 100%;
min-width:800px;
min-height:280px;
height: auto; "src="xxxx"
alt ="-"/>
I need it to show a dias show (SWF), where the size changes with the browser window size.
If some someone can help, I would be very happy :-)

Here is an older post that has examples of various scaling:
Here are examples of different scaling parameters available in the Publish settings. You can also add these parameters directly in the html (<param name="scale" value="noscale"). All the examples replace the actual Flash dimensions with 100% for both width and height (width="100%" height="100%"). These examples use the old <object> and <embed> to illustrate the different ways to scale Flash. Once you understand how it works I’d recommend that you use swfobject to place the Flash in your final project.
View the source code for each page to see the full code.
http://www.cidigitalmedia.com/tutorials/scale/exact_fit.html
"exactFit" scales the file to fit exactly within the confines of the screen, irregardless if the movie becomes consequently distorted. The original aspect ratio is not maintained. So round things are not round and squares are not square.
http://www.cidigitalmedia.com/tutorials/scale/noScale.html
"noScale" is the default setting, and causes the movie to be displayed at the originally designed dimensions.
http://www.cidigitalmedia.com/tutorials/scale/no_border.html
"noBorder" causes the movie to be scaled to what ever dimensions are needed to have no border surrounding the movie within the player, which consequently could result in some of the movie being cut off from view. In other words, the movie will maintain the original aspect ratio and will fill the screen completely. But if the movie has to be streched wider to fill both sides of the screen, it will also stretch taller, but then some of the top and the bottom of the movie may be cut off from view.
http://www.cidigitalmedia.com/tutorials/scale/show_all.html
"showAll" scales the movie to the size of the screen (which could cause pixelation if the file contains raster information), the difference between showAll and exactFit is that showAll mantains initial movie size proportions. Because it maintains the original aspect ratio, there can be space to the sides or the top and bottom. But everything always shows and they are not distorted. But notice the photo in the center, it becomes pixilated at larger screen resolutions.
The trickiest part of trying to go full screen is that it’s difficult to make the Flash wider without making it taller also, that is, to maintain the correct proportions or aspect ratio of everything on the stage. These methods are just simple scaling accomplished with html. There are also methods to dynamically scale the stage and it’s elements using Actionscript… but that’s a much more complex undertaking.
Best wishes,
Eye for Video
www.cidigitalmedia.com
Adninjastrator

Similar Messages

  • Fullscreen published in flash - htm 100%  width and height file is too big

    Hello everyone
    I need some help to create a fullcreen flash animation inside
    dreamweaver.
    What I did was to create a html file published in flash 100%
    width and height.
    It worked well on my explorer browser, but the size of the
    file is 995 k and this would be my index.
    When I publish on my provider the file doesn't open, probably
    is too big as an index, i don't know.
    Is there anyone there that could help me on that one?
    Thank you
    This is the code on Dreamweaver html
    <HTML>
    <HEAD>
    <meta http-equiv=Content-Type content="text/html;
    charset=ISO-8859-1">
    <TITLE>back_men</TITLE>
    </HEAD>
    <BODY bgcolor="#262626">
    <!-- URL's used in the movie-->
    <!-- text used in the movie-->
    11cf-96B8-444553540000"
    codebase="
    http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
    WIDTH="100%" HEIGHT="100%" id="back_men" ALIGN="">
    <PARAM NAME=movie
    VALUE="file:///C|/betoko_webfiles/flash_files/betoko/back_men.swf">
    <PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor
    VALUE=#262626> <EMBED
    src="file:///C|/betoko_webfiles/flash_files/betoko/back_men.swf"
    quality=high bgcolor=#262626 WIDTH="100%" HEIGHT="100%"
    NAME="back_men" ALIGN=""
    TYPE="application/x-shockwave-flash" PLUGINSPAGE="
    http://www.macromedia.com/go/getflashplayer"></EMBED>
    </OBJECT>
    </BODY>
    </HTML>
    <script type="text/javascript"
    src="fixit.js"></script>

    Well, firstly you have > 60 minutes of video, therefore, you should not use the 60 minute preset. Since you have 80 minutes of video, you're probably better off using the 90 minute preset.
    Secondly, the presets assume that you are compressing your audio to AC3 with A.pack or Compressor 2 (depending on which version of DVDSP you're using). Uncompressed audio takes up lots of disc space and bandwidth.
    Thirdly, the difference between the measured size in the Finder and the size in DVDSP is the difference between true gigabytes (how the Finder measures things) and billions of bytes (how DVDSP measures things). When you Get Info in the Finder, look at the number following the file size in GB... it's a larger number that's so many billions of bytes. This larger number should agree with the number you see in DVDSP. See the DVD FAQ for a discussion of this issue.

  • [svn:fx-trunk] 12007: When the Internet Explorer browser window is obscured Stage. width and Stage.height never return the proper sizes until/ unless the IE window is unobscured long enough for the player to feel it needs to render initially .

    Revision: 12007
    Revision: 12007
    Author:   [email protected]
    Date:     2009-11-19 12:45:27 -0800 (Thu, 19 Nov 2009)
    Log Message:
    When the Internet Explorer browser window is obscured Stage.width and Stage.height never return the proper sizes until/unless the IE window is unobscured long enough for the player to feel it needs to render initially.  This was preventing our preloader from completing, since we were waiting for a non-0 Stage size.  Took a slightly different approach to solving the bug for which the original logic was added to work around.
    QE notes: None
    Doc notes: None
    Bugs: SDK-24191
    Reviewer: Alex, Evtim
    Tests run: Checkin
    Is noteworthy for integration: No
    Ticket Links:
        http://bugs.adobe.com/jira/browse/non-0
        http://bugs.adobe.com/jira/browse/SDK-24191
    Modified Paths:
        flex/sdk/trunk/frameworks/projects/framework/src/mx/managers/SystemManager.as
        flex/sdk/trunk/frameworks/projects/framework/src/mx/preloaders/Preloader.as

    Revision: 12007
    Revision: 12007
    Author:   [email protected]
    Date:     2009-11-19 12:45:27 -0800 (Thu, 19 Nov 2009)
    Log Message:
    When the Internet Explorer browser window is obscured Stage.width and Stage.height never return the proper sizes until/unless the IE window is unobscured long enough for the player to feel it needs to render initially.  This was preventing our preloader from completing, since we were waiting for a non-0 Stage size.  Took a slightly different approach to solving the bug for which the original logic was added to work around.
    QE notes: None
    Doc notes: None
    Bugs: SDK-24191
    Reviewer: Alex, Evtim
    Tests run: Checkin
    Is noteworthy for integration: No
    Ticket Links:
        http://bugs.adobe.com/jira/browse/non-0
        http://bugs.adobe.com/jira/browse/SDK-24191
    Modified Paths:
        flex/sdk/trunk/frameworks/projects/framework/src/mx/managers/SystemManager.as
        flex/sdk/trunk/frameworks/projects/framework/src/mx/preloaders/Preloader.as

  • SWF loader need to load 100% width and height

    Hi,
        I have using dashboard in my application.In which the flex pages are loaded using SWF loader. the swf is not loading 100% when i minimize the browser. actually its loading 100% when the browser is full screen mode. suppose the browser is opened in 75% the swf also gets loaded based on the browser size. but after maxmizing the browser the SWF its not expaned to the actuall size of the browser. could you anybody help me plz..?
    Thanks & Regards
    Muthu

    Hi,
         I have used this code to load the swf in the main application:
    <mx:Canvas id="dashCanvas"  creationPolicy="all" cachePolicy="on" width="100%"  backgroundColor="#FFFFFF" horizontalScrollPolicy="off" verticalScrollPolicy="off" >
                   <mx:SWFLoader id="dashBoard" trustContent="true"  width="100%" height="100%" scaleContent="true" autoLoad="true"
    source="@Embed(source='../../../../assets/appl/dashboard/dashboard.swf')"  /> 
    </mx:Canvas>
    And i have set width and height as 100% in <mx:Appilcation> .
    Thanks and egards
    Muthu

  • How to make an Imagine in Adobe Muse span 100% width and 100% height.

    Hello,
    So this has been really puzzling me for a long time now and I have not found the correct answer.
    I want to create the effect on my website where I have an image that fills the screen now matter what size screen you look at it from. I know that this is possible with the 100% width option but you cannot replicate the same thing with the height.
    The best way to explain what i mean is by showing this example I have found:
    Nils Frahm
    If you look at this site, the image fills the screen, use your zoom in and out tools and you will notice no matter what your zoom the page still stays in full screen view! Now, wat's evem better is when you go to scoll using your mouse wheel or the scroll bar, you will notice this full screen image then scrolls up.
    Summary:
    What I want is a full screen image which covers the screen no matter what size you look at it.
    Any ideas??

    Yes, you can create that.
    Use the image as browser fill with position and apply scroll to fill , so that at certain key position the image will also scroll.
    Something like this : http://imagescroll01.businesscatalyst.com/index.html
    Thanks,
    Sanjit

  • 100% width and 100% height slideshow in Muse

    Hi, In Muse is it possible have a  slideshow that maintains full 100% width image but increases the slideshow height as the browser width is increased? In other words, I would like the slide show image to be say 1000px x 500px but if the viewer pulls the browser width t 1500px the slideshow image would still show the full image by becoming taller. At the moment I can do the 100% width but the slideshow stays the same height and therefore crops the image. .

    Hi, In Muse is it possible have a  slideshow that maintains full 100% width image but increases the slideshow height as the browser width is increased? In other words, I would like the slide show image to be say 1000px x 500px but if the viewer pulls the browser width t 1500px the slideshow image would still show the full image by becoming taller. At the moment I can do the 100% width but the slideshow stays the same height and therefore crops the image. .

  • Background, screen-width and screen-height

    can you help me a bit guys? how shall I create a movie where
    the background will be always 100% of screen-width and 100% of
    screen-height but the rest of the movie will be not affected by
    screen resolution - it means will be of fixed size.
    example: have a photo in front (200x300px) which needs to be
    always of that size and the background will resize according to the
    screen resoluiton ...
    it is even possible? thanks for any help ...

    Hello,
    Could you please try unchecking the sticky footer option from Site properties and then check if you face the same issue or not?
    Regards,
    Sachin

  • JTabbedPane: Tab Text, Tab Width and Tab Height

    Whenever i put text on JTabbedPane tab it displays it in one line, so when i have a text e.g. "XXXXXXXXX XXXXXXXXX"
    it displays it as it is not like XXXXXXXXX
    XXXXXXXXX
    How can I display it in two line or more?
    Does Tab width and height automatically adjust itself relative to the text inside it? If not how can I set the tab width and height?
    Thanks in advance.

    leemax quote:
    Simply add the escaped new line character "\n" to display the text of the tab on the next line.
    --Yeah i tried that already but anyway i solved the problem by making used of htnl tags "<br>"                                                                                                                                                                                                                                                                                                                                                                                                                               

  • Set box to 100% width and Center an image in that box.

    I can't seem to do this. I want to set a blank box to 100% width, place an image inside that box, center that image, and have the image continue to center itself when the page is resized. What am I missing?

    Hey Brad,
    I've done what you have done and I do not see the problem ... what's the width of your webpage set to? ... and the size of your Image? ...
    The only time is won't stay in the middle is when you resize the browser and you hit the maximum set width (say for example 960px) of your webpage (set in the 'site properties page') then the image stops being in the middle, visually, but it's still in the middle you just can't see it because of the resizing and your webpage won't auto resize anymore because of that limit that's set ... try resetting you 'site properties' webpage width down to say 500px wide and see if that looks ok, until you get to the width of that setting ... but the image should still in the middle ...
    Is that what you are on about? ...
    cheers,
    Gem

  • 100% width AND HEIGHT SLIDESHOWS AND RECTANGLES

    If you are using muse and have a simple layout with a hero image or slideshow, when you fullscreen your page, it will not be 100% height like most wordpress elements etc.]
    Very annoying adobe

    There is a widget for that 100% Height Widget Adobe Muse by MuseThemes – Adobe Muse Widget Directory

  • How can I get an SVG to Fill up 100% Width and Height of Stage?

    I'm currently trying to use an SVG image as a background to a symbol. However, when I try to get the image to fill up the whole background, it still forces the original image's aspect ratio when the stage resizes. Is their a way within edge to have the svg image behave like a raster image and have it completely fill up the stage, ignoring the aspect ratio of the image?

    Hey Cannonade,
    Are you trying this in Chrome/Safari? Webkit-based browsers will always force the SVG to scale in porpotion. Kind of lame I know, unfortunately I'm unaware of a workaround.
    Sarah

  • Wrong detection of screen.width and screen.height

    Latest version (26.0 Windows)
    After seeing unexplainable behaviour I built a page with an alert
    alert (screen.width+ - +screen.height)
    The first time I load the page the answer is correct: 1920 - 1080
    If I leave the page and I load it again the answer is: 1536 - 864
    The odd beahaviour consists of altering sizes and positions for sizes and images.
    Other browsers (Chrome, Opera, Safari and even the old IE ver 8) behave as expected.
    I unistalled Firefox and installed it again without any luck.
    Thanks.

    Sorry, nothing to do with zoom. This was the first thing I checked!

  • 100% percent width AND 100% height rectangles.

    Muse should be able to have a rectangle with an image in it scaled to 100% width and height so if my browser goes full screen, the rectangles adjust to it.
    No I am not talking about a Pinned rectangle sidebar menu. I am talking about rectangles on the page that contain images with a 100% width.
    Muse should be able to have MULTIPLE 100% height rectangles, so as you scroll, each section with a 100% width and height rectangle adjusts to your browser size.
    To see the desired effect, check out this site.  
    http://www.schlage.com/en/home/keyless-deadbolt-locks/touch.html

    Thats right ...
    there is no provision of defining percentage of ALV grid.
    it takes the size of contianer automatically....
    Though you can try dynamic screen generation. but i am not sure if it allows you to determine user's screen resolution and size.
    As all the processing is done on Applicaition serer this doesnt makes any sense.
    So u have to stick to old style programming and Static ALV grid size
    Hope this helps you.

  • Full-browser window flash, 100% width/height not working

    Hello.
    I'm pretty sure this issue has been discussed before but I
    couldn't find a suitable answer.
    I need my flash website to fill the whole browser window. In
    the 1st frame of my .fla file I used:
    stage.scaleMode = StageScaleMode.NO_SCALE;
    stage.align = StageAlign.TOP_LEFT;
    In the Publish Settings, I used 100% width and height and
    Default scale mode.
    I even tried adding CSS styles to the .html file, defining
    padding and margin as 0px and applying them both to the body tag
    and to a custom class that was later applied to the object tag that
    embeds the .swf file on the html.
    Still, the latest versions of Firefox, Safari and Opera (all
    on Mac OSX Leopard) still display a border around the website.
    What can I do? Thanks in advance.

    Thank you for posting.
    I've created a small video to show how to create a 100% width rectangle element. Please refer to the following Link : http://screencasteu.worldsecuresystems.com/aish/2013-03-21_1414.swf
    Hope this helps.
    Regards,
    Aishvarya Raj Rastogi

  • Get page width and height

    Hi I have my containers set out to 100% width and 100% height. In the end the actual size will always vary depending on the screen you are viewing it on. How would I go about in finding the containers size during runtime..

    Look at the height and width properties. They will be in pixels.

Maybe you are looking for

  • Can I share addresses lists between 2 different iCloud users?

    Does anyone know if I can share address lists/books between two different iCloud users?  I know you can do this with a calendar, but I would like to do it with addresses too.

  • 5.0.1 update: contacts don't show up.

    after update to 5.0.1 my contacts' names don't show up in text or phone call views so when i get a text it just looks like a number i don't have saved. Any ideas? FYI I updated via wifi for the first time

  • Convert CS4 Flash 10 as projector file to AIR For fileStream Writing Capabilities Not Working

    Have a simple kiosk .exe that works fine as a projector/.exe on PC platform. Wanted to add stats output to file of when FAQ buttons pressed. fileStream class available when I change publish settings to AIR AND works greate when I test movie w/in Flas

  • QuickTime is not playing a Torrent Video

    I downloaded the first season of The Big Bang Theory and when I tried to play it, a window popped up saying that I needed to download a plug in or more softwate for QuickTime. I don't know which software or plugins I need to download. CAN SOMEONE PLE

  • Editable views with instead of triggers in Oracle 10G

    Hi, We are attempting to migrate our database application from Oracle 9i to Oracle 10G. We have found that we are getting the error [ORA-03113 end-of-file on communication channel] when we attempt to insert multiple rows into database tables using ed