Home > ActionScript 2.0, ActionScript 3.0, Mootools > Using swfObject with Mootools

Using swfObject with Mootools

I'm sure most of us use swfObject, which in my opinion is the best option when it comes to embedding flash.

Lately I've been having a lot of fun with mootools and needed a way to embed flash dynamically. Basically I wanted my flash file to be embedded after a mootools click event was triggered.

So without further ado..

  1. window.addEvent('domready', function() {
  2.  
  3. //get the div I want to embed my flash into.
  4. var flashcontainer = $('flashcontainer');
  5.  
  6. //set all the flash properties
  7. var file = 'file.swf';
  8. var moviename = 'nameMyFlash';
  9. var width = '640';
  10. var height = '424';
  11. var version = '9';
  12. var bgcolor = '#000000';
  13.  
  14. //create the function that will fuse swfObject with mootools
  15. var embedFlash = function(){
  16. var so = new SWFObject(file, moviename, width, height, version, bgcolor);
  17. so.addParam("quality", "high");
  18. so.addParam("align", "middle");
  19. so.addParam("play", "true");
  20. so.addParam("loop", "true");
  21. so.addParam("scale", "exactfit");
  22. so.addParam("allowFullScreen", "true");
  23. so.addVariable("variable1", "variable 1 value goes here");
  24. so.addVariable("variable2", "variable 1 value goes here");
  25. so.write(flashcontainer);
  26. }
  27.  
  28. //get button by id
  29. var myButton = $('mybutton');
  30.  
  31. // create click event to fire my function called "embedFlash()"
  32. myButton.addEvent('click', embedFlash);
  33.  
  34. });

And that's it.. Hope it helps....

You can download the latest tools used above from the links below:
MooTools - download release 1.2.3 or SWFObject 2.2

Your slots payouts will be out of proportion from the progressive slots when you hit the slots bonus using the slots secrets of CasinoBonus.org!

  1. Erik
    November 2nd, 2009 at 21:41 | #1

    Hi, thanks for the code :-)

    I was wondering if you know how to replace a loaded SWF with another SWF using Mootools. Like the code on this webpage: http://pipwerks.com/lab/swfobject/load-onclick/2.0/index.html

    Best regards,
    Erik

  2. November 2nd, 2009 at 21:53 | #2

    @Erik
    Hi Erik,
    Using the code above you could just change the file name variable via the click event and then call embedFlash().

    For example:

    myButton.addEvent(‘click’, function(){
    file = ‘anotherSWF.swf';
    embedFlash();
    });

  3. November 2nd, 2009 at 21:59 | #3

    oh and you might want to clear the div container first..

    myButton.addEvent(’click’, function(){
    flashcontainer.empty();
    file = ‘anotherSWF.swf’;
    embedFlash();
    });

  4. Erik
    November 3rd, 2009 at 02:36 | #4

    @Flashnutz
    Can’t get it to work.

    Firefox Error console says: “swfobject is not defined” when I run your original code.

    Any idea how to fix this?

  5. November 3rd, 2009 at 14:16 | #5

    Have you included the swfobject.js file to the header of your page?

    You can get the source code from http://code.google.com/p/swfobject/

  6. Erik
    November 3rd, 2009 at 20:28 | #6

    @Flashnutz
    Yes, I included swfobject.js in the head already.

    And added the following code into the of my html file:

    Click Me

    When I click the link nothing happens.
    Same thing in IE7 btw.

    “swfobject is not defined”

  7. Erik
    November 3rd, 2009 at 20:36 | #7

    @Flashnutz

    Oops, code added to body:

    (a id=”mybutton” href=”#nogo”>Flash</div)

    (Using instead of () of course)

  8. November 3rd, 2009 at 20:45 | #8

    shouldn’t this be

    (div id=”mybutton” href=”#nogo”>FlashFlash

    Or is this just a typo in the comments? replace a with div…

  9. November 3rd, 2009 at 20:50 | #9

    have you got the page hosted? I would like to see your code all together.

  10. Erik
    November 3rd, 2009 at 21:29 | #10

    @Flashnutz
    Having trouble copying and pasting the code, sorry.

    My page has anchor tag (a) id=”mybutton”
    And a div id=”flashcontainer”

    When I click the link, “file.swf” should be injected into the “flashcontainer” div right?

    The code is not online yet, but apart from the anchor and the div mentioned above, I only have your code on the page.

    Starting to think it’s a swfobject problem. Your code looks okay.
    Googling for for “swfobject is not defined” you get a lot of rusults. But didn’t find a solution yet.

  11. January 17th, 2010 at 13:30 | #11

    Erik, if you need help, you have to show the entire script. If you’re getting an undefined object error, most likely not including the script properly.

    The code which Flashnutz posted is all good.

  1. August 5th, 2009 at 02:18 | #1
SEO Powered by Platinum SEO from Techblissonline