Pass Values to a SWF with JavaScript and SWFObject
videos

Pass Values to a SWF with JavaScript and SWFObject

Tutorial Details
  • Difficulty: Basix
  • Program: Flash CS3+
  • Required: SWFObject and TweenLite
  • Estimated Completion Time: 60 mins

SWFObject provides a simple way to pass values to a SWF using only JavaScript: no server-side code required! In this tutorial, we’ll build a fundraiser meter that can easily be updated with the amount donated so far, without needing to recompile the SWF.


Final Result Preview

View the source of the demo and you’ll see that the target and current donation amounts are defined in JavaScript.


Section 1: What’s SWFObject? Why Use It?

Don’t like ads? Download the screencast.


Section 2: Set Up the Fundraiser SWF and Get to Grips with SWFObject

Don’t like ads? Download the screencast.


Section 3: Additional Functionality and Polish

Don’t like ads? Download the screencast.


Non-IDE: Relevant Code in Plain Text

If you’re not using the Flash IDE, here’s the relevant code in copy-and-pastable plain text:

if (root.loaderInfo.parameters["goal"] != null)
{
	goal = Number(root.loaderInfo.parameters["goal"]);
	actual= Number(root.loaderInfo.parameters["actual"]);
}
else
{
	// if can't access values in page
	goal = 100;
	actual = 50
}

The tutorial videos explain how to hook these up to a JavaScript object in the page.

Tags: Videos
Add Comment

Discussion 5 Comments

  1. Charles says:

    Hey, thanks for the tut. Exactly what i was looking for!

  2. Story Feldberg says:

    This is great,.

  3. Nykeri says:

    hey cool i just was in the process of designing a flash app that would accept values from js and was wondering how to do it thanks a lot i knew nothing of this gonna try it out

  4. that’s all cool tips, thank you very much for sharing.

    Really SWFObject is very simple & helpful to use for communicating Flash by JS

  5. Webestools says:

    Thank you for this tips!

Add a Comment

To add a code snippet to your comment, please wrap your code like so: <pre name="code" class="html">YOUR CODE</pre>. You can replace the class name with "js," "css," "sql," or "php." If there are any "<" or ">" within your code, please search and replace them with: &lt; and &gt; respectively.