Popup window from Flash, exact-sized, without browser buttons or scrollbar

Just got an email about opening a scrollbar-less, browser button bar-less, exact-sized window from Flash.  Or what’s commonly called among desperate googlers, a Flash popup window. But keep in mind, your content in the window that pops up doesn’t have to be Flash.

This was pretty easy and reliable back in the Actionscript 2 days. This tutorial’s sales page has some good examples of a Flash popup in action… http://www.cartoonsmart.com/animation_fx.html … even with Safari or Firefox being set to block popup windows, those links for each animation still open fine. 

I guess I hadn’t tried making a similar Flash popup window in Actionscript 3, because I had a hell of a time getting it to work for this article. Mostly because I forgot I had Safari set to block popup windows, and after giving up on using the method I’ll show you below, I started on a semi-fruitless search for a way to resize and remove the browser bar with Javascript. Resizing was easy, but all the ancient Jedi ways of getting rid of the menubar don’t seem to work now. But in the zip file for this article I’ll also include an html file that resizes to an exact width and height once loaded. Or just google resizeTo and javascript for alternate examples. 

Anyway, get on with it, right…

Using Actionscript 2 all you need to use is this on your button….

on(release){
getURL (“javascript:popUp(‘http://www.cartoonsmart.com/fx_examples/the_gloom.html’)”);
}

…..WITH  the javascript below somewhere between your Head tags in the html thats embedding your swf….

<SCRIPT LANGUAGE=”JavaScript”>
function popUp(theURL) {
var top=open(theURL,”winname”,”width=600,height=500,toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0″);
top.focus();
}
</SCRIPT>

Notice the function name popUp which appears in both sets of code. That should clue ya in as to how this works. And if you do want it to work, be sure you upload everything and test it live. Locally won’t do thing. You can see a working example here. Which is the same file included in the source files linked up below. 

Now using Actionscript 3, here’s some less-than-perfect code for a movieclip with an instance name of your_button

var js:URLRequest=new URLRequest();
js.url=”javascript:window.open(‘http://www.cartoonsmart.com&#8217;,’popUp’,’width=800,height=400′);newWindow.focus(); void(0);”;

your_button.addEventListener(MouseEvent.CLICK,openPopUp);

function openPopUp(evt:MouseEvent):void {
navigateToURL(js,”_self” );
trace( “Warning! this might not work in browsers that are set to block pop up windows”);
}

 

This example doesn’t need any javascript written in an html file. Come to think of it, I probably could have found a similar method in AS2 that didn’t require adding code to your html, but whatever, it works.  You can see an example of the AS3 Flash popup here… But remember, it probably won’t work if your browser prefs block popups. 

I’m shelving this in the Coding Category of the blog, in case you need to find it quickly later.  Source files are linked up right below.

Click to Download the Source files

Advertisements

21 thoughts on “Popup window from Flash, exact-sized, without browser buttons or scrollbar

  1. Before the wonderful and generous Alex July http://www.linecraft.com/ donated 7Web Behaviors to the Mac Lab for the kids to use, I was one of those “desperate googlers” searching for the elusive “Flash popup window” code with mixed results. The 7Web extension embeds all the code in the swf so my question is: what’s the change in the javascript in your solution if you want the new window to open in the center of the monitor?

    I know the answer is probably painfully simple to a mutant genius, artist-scientist type like you, Justin, but I’m only a simple graphics guy, lost in the arcane world of curly braces and variables. 😉

  2. Hey Justin!

    I’ve been buying and following your tutorials for about five years now, and I’ve been following your blog for a long time now, too, but never commented. First off, the new layout is soooo much better than your first one.

    I’ve been coding using Actionscript 3 almost exclusively for a little over a year now, and I don’t ever wanna look back.

    An alternate to the way you’ve set things up, is to use the javascript that you’ve already got for your AS2 version, and call to us using the ExternalInterface class. It would look something like:

    import flash.external.ExternalInterface;

    your_button.addEventListener(MouseEvent.CLICK, onClick);
    function onClick(e:MouseEvent):void
    {
    ExternalInterface.call(“popUp”, “http://www.cartoonsmart.com/fx_examples/the_gloom.html”);
    }

    Where “popUp” is the javascript function that you want to call, and any additional arguments passed after that get passed through to your javascript function as expected variables.

    Hope this helps someone. I’ve been schooling myself for so long by using cartoonsmart tutorials, Lee Brimelow tutorials over at gotoandlearn.com, and various other great generous flash community players, I think it’s time I start giving back.

  3. Hey Mike! Pretty sure its one of these…
    window.moveTo(100,100);
    self.moveTo(200,200);
    this.moveTo(100,100);
    moveTo(300,300);

    Just depends on the usage.

  4. Thanks Dan! I figured it was something easy like this, but when I was trying to redo the AS2 version in AS3, I definitely wasn’t using the ExternalInterface call. I’ll test this out later! Thanks!

  5. Kathy says:

    I have a question. what if it’s more then one button? I have 5 buttons that i want a pop window to appear. your action scipt 3.0 worked on the 1st button, but once i used it again the same code again, it didn’t work and yes… I did change yourbutton. to what i named each button of mine. what am i missing?

  6. You just need to change the variable each time which defines where the link goes ( that js.url )

    there’s better ways of doing this, but the quickest to describe here as a comment, is to just include that new variable value as part of your function ( openPopUp).

  7. Jeremy says:

    So I tried this, copied the code exactly as you had it here onto the button (Flash 8 Pro) and the JS in between the head tags of my html file – uploaded and nothing worked. I clicked and nothing happened, I turned of my popup blockers and still nothing happened. I’m not really sure what I’ve done wrong but some help would be really appreciated.

    Thanks in advance!

  8. Samantha says:

    Hi, I am a desperate googler trying to find out how you can do this without doing it through a browser.

    This simple code allows me to click on a button in a current swf which then opens the file kitty.swf in a blank html file…

    on (release) {
    getURL(“kitty.swf”,”_blank”);
    }

    … I want to know how you can do exactly the same thing without using a browser/html file. I just want to open a new swf in addition to the current swf I have open.

    But then.. us coders are too complex to understand simple things..

    HELP PLEASE ;0)

  9. In AS2, you want to use loadMovie();

    Works by either writing…

    loadMovie(“myOtherSwf.swf”, 1); //puts the swf above everything else

    or by replacing another movieclip on stage (target, below)

    loadMovie(“myOtherSwf.swf”, target);

  10. Great site and I am a desperate Flash Pop up googler that found you! I have used Lee Brimelow AS2 code for a site and now your modification. The pop ups work with the scrolling thumbs but those thumbs/flash images on the original page disappear when you move the mouse up to the pop up. Any ideas?

  11. Hey, I came across this blog post while searching for help with JavaScript. I’ve recently changed browsers from Safari to Microsoft IE 6. After the change I seem to have a issue with loading JavaScript. Everytime I browse website that requires Javascript, my computer doesn’t load and I get a “runtime error javascript.JSException: Unknown name”. I cannot seem to find out how to fix it. Any aid is greatly appreciated! Thanks

  12. Marcelo Pickelny says:

    Hi.. I was traying to code a button to open a popup in AS3.
    I try to use the code appears in this page:

    var js:URLRequest=new URLRequest();
    js.url=”javascript:window.open(‘http://www.cartoonsmart.com’,’popUp’,’width=800,height=400′);newWindow.focus(); void(0);”;

    your_button.addEventListener(MouseEvent.CLICK,openPopUp);

    function openPopUp(evt:MouseEvent):void {
    navigateToURL(js,”_self” );
    trace( “Warning! this might not work in browsers that are set to block pop up windows”);
    }

    I receive and error message that
    js.url=”javascript:window.open(‘http://www.cartoonsmart.com’,’popUp’,’width=800,height=400′);newWindow.focus(); void(0);” has a Syntax error..

    Could you help me..

    thanks

  13. Nikita says:

    Hi,

    I have the same problem, plz help.

    name of button was changed to defined.
    or just comment – what it can be?

  14. Jorge says:

    Hi Justin,
    Thanks for the great explanation. But i want to know if it’s posible to use this code to open the window from a cd rom, because it works well when is on the web, but when i try from a cd rom it opens a white window without content.
    What can i do?

    Thanks again and i hope you can help me.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s