ActionScript 3.0 :: Fluid Layout Not Filling Browser Correctly
Jan 12, 2011
I have found a great resource for a fluid flash layout but there is one glitch with the site in that when it loads the content is all pushed up into the top left hand corner, if you then click rescale the browser it then fills the screen correctly but not initially. Here is the site: [URL]. The as. file for reference is with the rest of the files at this download link.[URL]
I have found a great resource for a fluid flash layout but there is one glitch with the site in that when it loads the content is all pushed up into the top left hand corner, if you then click rescale the browser it then fills the screen correctly but not initially. Here is the site:[URL]
ive been using this tutorial [URL] after following the tutorial everything works except when I have an image that is not on all frames, the fluid layout doesnt work on that image until I resize the browser again after I have gone to that frame, which obviously isnt quite right.
how to make the preloader works on the full screen website/ fluid layout. I add the Stage.resize on the code for FYI When I added this code to the bar, it expanded to full screen, but there's no loading bar. The text is also no progress.
I'm trying to do a full browser flash site in which i want some of it's elements to behave like footers. Meaning that, as i resize the browser window i want them to always appear at the far end of the stage. I'm using swfobject and swffit but the problem is that if i resize the browser to be larger than the original stage width and height, those elements disappear.
I want to make a fluid layout for the website I'm working on right now. I know the basic concepts of how to center an object and keep it there, or how to stick a shape to the top or bottom... etc. But if there's a movieclip that I would like it to conserve its position proportionally as the visitor resizes the stage, how can I do that?
I have been given a site to update/improve, which uses many AS1 and AS2 elements, and my team likes a piece of AS3 I've found for a fluid layout which tweens the site container to the centre of the browser's window, and we want to keep it.But at the moment, I have to load the AS1 site into an AS3 container in order to make this work, and this means we lose the deep linking, and it's really cumbersome loading 1 thing into another which is loaded into another...
Sooo, I was hoping someone knows how to translate this AS3 code into AS1/2. Is this possible? Does AS1/2 have the appropriate tween/ease classes? Here's what the container page looks (please ignore the commented out sections).siteLoader is the MC i'm loading the main site's SWF into. AS1 would also make this much simpler with loadMovie command.
My question is this: Can I add/modify to this code to make the MC scale proportionately up as I drag the browser window farther open? Right now it stays centered but it stays the same size.
i have index.swf as a main swf and other swf for the other menu.. and i can't get center position for one swf which is collection.swf here's the source file :[URL]
I am making a flash website and I am implementing a fluid layout. In the website I made a drawing program that is supposed to move along with the rest of the elements of the website when the window is resized. Now the problem is not the drawing program itself, ive got that working very well, the problem is when the canvas movieClip onto which the painting is being done is moved when the window is resized, the movie clip does not stay on centre, and the drawing is displaced outside the canvas movieClip and no longer happens on the mouse X and Y.For the sake of simplicity I made a simplified version of the drawing program with the fluid layout code and drawing code. No point in going through 200 lines of code when the problem lies within 10 lines of code.[code]The pink box is the canvas the user is able to draw on. The grey box is used to test the fluid layout code and to give coordinates for the pink box. When the file first loads both the pink and grey boxes are side by side, during the resize event they should stay side by side, however they do not.
I'm basically a designer with no real programming background. I do understand some basic of AS2, but with AS3 I kinda have no clue. Anyway I got a problem that I have been trying to solve alone for quite some time and can't seem toI'm trying to write my own code based on the thing I have seen in both tutorials. I wrote the fluid layout part based on the first tutorial link, and the preloader part based on the code found in preloader.fla in the second tutorial link. So now I have 2 seperated swf file, which is website.swf and preloader.swThe thing is that once the preloader is done and the website.swf is shown, the fluid layout code inside website.swf doesn't seem to work. Both files has the fluid layout code, and the code works when u open the file seperately, but when it's linked together the code just fails.here's the code on the preloader.fla:
I'm building a photographer's gallery website and I need it to resize to fit in browser window. So far so easy...What I would really like to achieve is a maximum and minimum size that the gallery will go to.
So, if the images I am using are 1400x1000 (for example) when this size is reached by the user expanding the browser window i don't want the gallery to expand any more, just sit in the middle of the page.
Similarly I don't want the gallery to go below say 800x600... how to set a max/min?
I have a fluid layout and I have buttons and things on the top right. When the person resizes the window down, they all jump on top of each other. How would I get them to stop after they get to the point of overlapping each other? If you go here: [URL] And go to their main page. When you resize your browser down, the elements stop at a certain point and just get cut off. How do I achieve this effect? I'm thinking somewhere along the lines of using an enter_frame listener to detect the x and y coordinates of these elements, and when it hits a certain coordinate to remove the listener that moves these elements. Can someone point me in the right direction?
I am using Gaia framework with a fluid layout at here is what I get
This is the error: TypeError: Error #1009: Cannot access a property or method of a null object reference. at com.gaiaframework.FluidLayout::FluidObject/reposition()
I'm trying to make a site for all screen resolution. Seems this method don't work when I have a tween navigation. The navigation border stay the same even after I put this coding:
I am trying to build a site with fluid layout. I have three classes: Preloader, Main and Background.Preloader loads main.swf and has resize function where it can access Background like so:
Main has an instance of Background.Background draws vertical lines. It uses fluid layout on its own. Works fine.Here is the catch: Background utilizes stage.stageWidth and stage.stageHeight,when tested with separate fla works like charm. However, when accessed thru Preloader throws this error: Error #1009: Cannot access a property or method of a null object reference.I think it is because use of stage but I don't know how to go about it.It also uses its own resize function.
So, what is the best way to put it all together? Where should I keep resize function? What I need to do with stage object in Background?
I added a Menu_mc on my stage. Initially, this should be at the center of the stage and when I click on it, it will tween on the upper left corner of the browser. However, when I resize the browser, the Menu_mc goes back to the center of the screen.
I have tried separating a different actionscript file where it is specifically for initialization of the object and another one for resizing. And then when I call it on my main AS file it goes like this:
Code: // Add the symbols to stage var Menu_mc = new Menu_MC(); addChild(Menu_mc);
I've set the publish settings to 100% width and 100% height and have then added the 'noScale' function into the first frame of my timeline. Here is an idea of what I'm trying to create:
I have three movieclips that are touching the left side of the Stage and want them to touch the left side of the browser but centre vertically. I can do this by adding the 'Stage.align = LC' command, but not sure if this is the right way to go about it.
The movieclip that is on top contains a logo and I want it to have a fixed size. I called the instance name 'logo_mc'.
The movieclip below 'logo_mc' is called 'container_mc' and is a strip of photographs that I need to run from the left to the right side of the browser no matter what the browser size. I need this movieclip to scale proportionally up and down as they viewer resizes their browser so the first photo is touching the left side of the browser and the last picture is touching the right side (without distorting).
The final movieclip is called 'buttons_mc' and is right below the 'container_mc' clip. This movieclip needs to remain a fixed size.
Obviously when the 'container_mc' clip resizes I need the other movieclips to move up and down to stay the same distance above and below the 'container_clip'.
I have made a liquid layout flash site in AS3 but it doesn't rescale correctly in any browsers above 1440x900. I know most people don't have screens bigger than this but it should be scaling to the entire window regardless of the screen size. Can anyone take a look at my code which has resize handlers but still no joy. [code]...
I have made a liquid layout flash site in AS3 but it doesn't rescale correctly in any browsers above 1440x900. I know most people don't have screens bigger than this but it should be scaling to the entire window regardless of the screen size, small or large. Can anyone take a look at my code which has resize handlers but I still have no joy. This is the website but I am not allowed yet by this site to add the entire url! [URL]
I have built a liquid layout Flash site using AS3 but it isn't scaling correctly once I go above 1280x1024. I am currently using a Mac screen with dimensions of 2560x1440 and it looks terrible. The menu pushes to the top and the bg and page info stays central but with no scale.[URL]..
The HTML is 100% w+h so it's obviously something within the AS3 code. This is causing me nightmares so if someone could take a look at the code pasted and see if there is a way to resolve
Is there any way to make a full browser swf that, at a certain point, stops scaling to the stage and allows the browser to use it's native scrollbars? For example, say my flash site has a top bar (it's y is always 0) and a bottom bar (it's y might be stageHeight - 15). Is there any way to tell the movie to stop scaling if the bottom bar's y is less than say 300, and from that point have the browser display it's scrollbars allowing you to scroll the content?
How to create a fluid / liquid / fit to screen flash site with scrollBar. I am pretty much new to AS3 and flash. I have been looking for a way. To have, a background image contained in a MovieClip. Let's say: bg_mc and have it scaling automatically to fit the different user's Internet browser screens size. In other hand, have another MovieClip that handles and holds the site. Let's say: content_mc without being affected by the scaling of the bg_mc. And last, in the case... the content_mc height does not fit in the user's internet browser. Have the internet browser with its scrollBar so the user can scroll down and see the rest of the site. (right now my content_mc is being cut off the screen).
Examples Flash sites with this layout: [URL]. The Next Code: it does generate a full browser's background image but there is no scroll bar for IE or FireFox and in some cases stretch my content_mc if i play too much with StageScaleMode. // -----> AS3.0 import flash.display.Stage; import flash.display.StageScaleMode; import flash.display.StageAlign; var myStage:Stage = this.stage; myStage.align = StageAlign.TOP_LEFT; [Code] .....
I'm trying to get my main class to resize to the browser window size. I'm listening on the stage to Event.RESIZE, updating my width/height to match the stageWidth/stageHeight, and drawing a rectangle to show me how big it is. When I resize, it flashes between a small and big size every other time the event fires. The width and height are correct in both cases, but in the "small" case, everything is in a small box.
I have created a liquid layout site in AS3 and am having an issue with the stage resize. Although the elements flow with the browser on resize I notice if you drag the browser's window to the right a white border appears. Now obviously not everyone would do this but it's more of a concern for anyone viewing the site on a large resolution screen. The site is currently 1200x800 in it's original dimensions and I want it to retain it's size in larger browsers.
I want to fade in the full browser background, however most of these tutorials I have seen have it loaded somehow with the BitmapData or another class, and when it is done this way, I cannot add any animation. Others, the background covers the whole browser, but it doesn't really resize, so most of it is just cropped out. Some, the positioning isn't always consistent for all resolutions. Some don't really explain how to position images in different parts of the Flash besides the direct center, top left, top right, etc. They will tell you how to get these spots, but not other spots.
The reason I chose to stick with this one is that is the positioning is perfect. Positioning looks the exact same in all resolutions and what not, so this is what I want. But as you can see, it uses a BitmapData class, so I don't know how to add any animation because the file isn't even on the stage. It's in the library and I get this effect by giving it an identifier. Also, the background doesn't resize. It fits the whole browser, but most of it is cropped about like I mentioned earlier. The video tutorial really didn't cover the best way to adjust size, so now that I have the perfect way to position my clips, I don't know how to resize them, so they still look good. I remember in another tutorial I was guessing random numbers such as: example._height = Stage.height / 2.58430953;
I basically just plugged in random numbers until it looked closest to the way I wanted it to. The problem with this was that image quality was reduced.
The Background - Must be able to add animation to the full browser background - Background must be resized so that nothing is missing from the original image, not cropping to fill the whole browser, resizing to fill the whole browser.
Positioning (Not really a problem now but...) - An easy way to position anything where ever you want. - Consistent in all resolutions.
Scaling Clips - A way to scale clips so they just fine in all resolutions so that an image with a width of 512 px that looks great in 1280x1024 doesn't end up taking half of someone screen's that uses a 1024 x 768 resolution. - No loss of quality.
I have this thumbnail photo gallery (AS2)that is running fine on a pc, but when viewed in firefox or safari on a mac the thumbnails do not show up. Here is a live link: [URL] at the bottom you should see the thumbnails, but maybe not if viewing on mac? You can download the fla from here [URL]. Attachments: photos.zip (1.1 MB)
I am having a issue scaling the swf in the browser. The properties are set in the html tab correctly I think. I published in flash and it scales the movie only on the first and second frame(while the preloader is playing). then it jumps back to the original size of the movie even when the browser window is smaller. My settings are
I have a full-browser flash site, with a movie clip horizontal nav bar at the bottom of the page. I've got everything working well (the background rescaling to fill the browser when the browser window size changes, the horizontal nav bar at the bottom....) for the most part. One thing is really getting to me however. Check out the example I made here: the nav bar sits in the middle of the page. The moment you re-size the browser, it pops into the desired location near the bottom and stays there, even if you continue to re-size. However I want it to appear where it should at the bottom of the window on page load, without having to re-size the browser windowIn the following code, main is the placeholder for the image slideshow that runs in the full browser, menu_mc is the menu.