Trigger banner ad rotation from Flash events

Posted on 2008-10-15
Last Modified: 2013-11-11

I want to trigger an ad banner rotation from Flash. When the user flips 5 pages I would like the banner to change.

What combination of actionscript and javascript would I use to accomplish this?

myBook._visible = true;
var zoomRatios = [2,4,5];
var zoomed = false;
var zoomCount = 0;
var clk = 0;
navbar_mc.index_btn.onPress = gotoPage;
navbar_mc.next_btn.onPress = nextPage;
navbar_mc.prev_btn.onPress = prevPage;
zoom_mc.zoom_in_btn.onPress = openZoom;
zoom_mc.zoom_out_btn.onPress = closeZoom;
zoom_mc.zoom_out_btn._visible = false;
service_mc.help_btn.onPress = openInfoWindow;
service_mc.print_left_btn.onPress = printLeftPage;
service_mc.print_right_btn.onPress = printRightPage;
myBook.onPageLoad = function( pageURL, pageNumber ){
if( pageNumber == 0 )this.flipCorner("top-right");
myBook.onStartFlip = function(i) {
	if (i == undefined) {
	myBook.flipOnClickProp = true;
myBook.onFlipBack = function() {
	myBook.flipOnClickProp = false;
myBook.onClick = function(i, page, isCorner) {
myBook.onPutPage = function() {
	myBook.flipOnClickProp = false;
	var res = "";
	if (this.leftPageNumber && this.rightPageNumber) {
		res = this.leftPageNumber+" / "+this.rightPageNumber;
	} else if (this.rightPageNumber == 0) {
		res = this.rightPageNumber;
	} else if (this.leftPageNumber && !this.rightPageNumber) {
		res = this.leftPageNumber;
	navbar_mc.current_page_txt.text = res;
function sendData(){
       	var sender:LoadVars = new LoadVars();
function nextPage() {
      if( zoomed ){
} else {
      //sendData (";201954821;9066607;j?");
function prevPage() {
     if( zoomed ) {
} else {      
      //sendData (";201954819;9066607;q?");
function gotoPage() {
      if( zoomed ){
} else {
      myBook.flipGotoPage( 0 );
      //sendData (";201954818;9066607;p?");
function startZoomingMode() {
	zoomed = !zoomed;
	if (zoomed) {
		myBook.enabledProp = false;
		_root.attachMovie("ZoomPointer", "zoom_pointer_mc", 100);
		zoom_pointer_mc._x = _xmouse;
		zoom_pointer_mc._y = _ymouse;
		zoom_pointer_mc.onMouseMove = function() {
			this._x = _xmouse;
			this._y = _ymouse;
	} else {;
		myBook.enabledProp = true;
function openInfoWindow() {
	clk = clk+1;
	myBook.enabledProp = false;
	if (clk==1) {
	info_mc._x = Stage.width/2-info_mc._width/2;
	info_mc._y = Stage.height/2-info_mc._height/2;
	info_mc.close_btn.onRelease = closeInfoWindow;
function closeInfoWindow() {
	clk = 0;
	myBook.enabledProp = true;
function printLeftPage() {
	print_box.printIt(myBook.leftPageNumber, myBook);
function printRightPage() {
	print_box.printIt(myBook.rightPageNumber, myBook);
/*function showHint() {
	_root.attachMovie("Hint", "hint_mc", 215);
	hint_mc._x = _xmouse;
	hint_mc._y = _ymouse;
	if( (hint_mc._y + hint_mc._height) > Stage.height )hint_mc._y -= ((hint_mc._y + hint_mc._height)-Stage.height + 10);
	if( (hint_mc._x + hint_mc._width) > Stage.width )hint_mc._x -= ((hint_mc._x + hint_mc._width)-Stage.width + 10);
	hint_mc.onMouseMove = moveHint;
function moveHint(){
	this._x = _xmouse;
	this._y = _ymouse;
	if( (this._y + this._height) > Stage.height )this._y -= ((this._y + this._height)-Stage.height + 10);
	if( (this._x + this._width) > Stage.width )this._x -= ((this._x + this._width)-Stage.width + 10);
function hideHint() {
	hint_mc.onMouseMove = undefined;
function openZoom(){
	myBook.enabledProp = false;
	var ratio = zoomRatios[zoomCount++];
	if( zoomRatios[zoomCount+1] == undefined )
		zoom_mc.zoom_in_btn._visible = false;
		zoom_mc.zoom_in_btn._visible = true;
	if(!zoomed)	{
		ow = myBook._bookWidth;
		oh = myBook._bookHeight;
		cx = myBook._x;
		cy = myBook._y;
	myBook.setSize(ow * ratio, oh * ratio);
	var left = cx-myBook._bookWidth/2 + ow/2;
	var top = cy-myBook._bookHeight/2 + oh/2;
	var right = cx+myBook._bookWidth/2 - ow/2;
	var bottom = cy+myBook._bookHeight/2 - oh/2;
	mask_mc.onMouseDown = function(){myBook.startDrag(false, left, top, right,bottom);};
	mask_mc.onMouseUp = function(){myBook.stopDrag();};	
	mask_mc.onRollOver = function(){};
	zoomed = true;
	zoom_mc.zoom_out_btn._visible = true;
function closeZoom(){
	if(zoomCount > 1){
	myBook.enabledProp = true;
	myBook.setSize(ow, oh);
	myBook._x = cx;
	myBook._y = cy;
	mask_mc.onMouseDown = undefined;
	mask_mc.onMouseUp = undefined;
	zoomed = false;
	zoomCount = 0;
	zoom_mc.zoom_out_btn._visible = false;
	zoom_mc.zoom_in_btn._visible = true;
function drawZoomMask(){
	var cx = myBook._x;
	var cy = myBook._y;
	var x0 = cx - ow/2;
	var y0 = cy - oh/2;
	var x1 = cx + ow/2;
	var y1 = cy + oh/2;
	_root.createEmptyMovieClip( "mask_mc", 2000 );
	mask_mc.beginFill( 0, 100 );
	mask_mc.moveTo( x0, y0 );
	mask_mc.lineTo( x1, y0 );
	mask_mc.lineTo( x1, y1 );	
	mask_mc.lineTo( x0, y1 );	
	mask_mc.lineTo( x0, y0 );	
	myBook.setMask( mask_mc);

Open in new window

Question by:dialektkid
1 Comment

Accepted Solution

ckoning earned 500 total points
ID: 22734728
The easiest way to accomplish what you are after is to use the ExternalInterface class to call a javascript function to switch the add. This is a multistep process:

1) Put the add in its own div
2) Write a JS function to load an ad into that div
3) Write an AS function to call the JS function
4) Count the page turns and call the ad rotation function to accomplish effect

See code below for example. Might require modification and debugging. I am in an airport, and don't have the resources to fully test the code. Please let me know if you have problems.
// STEP ONE: Place the ad in its own div
// In the HTML source, you currently are using a table to place the ad on the page. This is less 
// than desirable for a number of reasons, but such a discussion is the topic for another post. To 
// access the content of the ad, need to place it in a div and give it an id. inside the table, 
// substitute this markup for the '<!----- begin ad tag ... ------>' that currently loads the ad:
<div id='bannerAd'>
   <script type="text/javascript"> getAd(); </script>
// The JavaScript will call the function written in step 2 to load the first add. 
// Also need to give it some CSS to make it fill the table space given. in the CSS place:
   position: relative;
   width: 100%;
   height: 100%;
// Now we have a JS accessible element to place the ad in, and will be in the same position and size as current layout.
// STEP TWO: Write JavaScript function to change the ad
// Now that we have a place to put the ad, need to write a repeatable JS function to load a random
// ad into the spot. Start with the existing code, modify to suit. Place the following script tag 
// just after the <body> tag to make sure it is available for later calls:
<script language="text/javascript">
function getAd()
  document.getElementByID('bannerAd').innerHTML = '<SCR' + 'IPT LANGUAGE="JavaScript" SRC=";ap=shopping;pg=shopping;sub=;sz=728x1;swrd=;ptile=1;ord=' + ord + '?" ><\/SCR' + 'IPT>';
// This is the tricky part of the whole process. I cannot recall offhand if innerHTML will actually
// evaluate the resulting script tag or just write it to the page. If it does evaluate, then all is
// well. If not, then some more sophisticated techniques are required to get the script to execute. 
// Also note that as written, the function will only work on DOM compliant browsers. Older browsers
// will not handle the document.getElementByID function. Both of these topics are better suited to
// the JavaScript section of ExpertsExchange. Posting there will most likely result in some very 
// slick solutions in the event that this function is not sufficient. For now, we will operate on 
// the assumption that the function works. Now we have a javascript function that will load a random
// doubleclick ad into a div in the appropriate place in the correct size. Now we need to trigger
// the switch from ActionScript.
// STEP THREE: Write an ActionScript function to call the JavaScript function.
// Add the following function to your AS at line 53 (order shouldn't matter, but it is good form to
// define functions before they are used):
function getAd():void
// For more details on how the ExternalInterface class works in ActionScript 2, see the livedocs. 
// Now the only remaining challenge is to count the pages and call the ad function after five pages.
// STEP FOUR: Count the page turns and call the ad function appropriately.
// First, declare a counter for page flips. On line 9 add:
var pgFlips = 0;
// Next, modify the page nav code to count the pages. Replace lines 65, 75, and 84 with:
if( pgFlips <= 5 )
{  // Not enough page flips to rotate ad
{  // Otherwise, there were five or more page flips. Time to rotate. First, reset counter
   pgFlips = 0;
   // Now rotate
// That ought to do it. The code can be condensed by incorporating the counting logic into the 
// page counting into getAd() and then simply replacing lines 65, 75, and 84 with 
// However, for illustrative purposed it was separated here. 

Open in new window


Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
href return to normal window 5 31
How Close unsubmited attempts 10 46
Glitching Slide Show 19 27
Why is my $_POST not going to results page 10 41
In Part 1 ( we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
This article discusses how to implement server side field validation and display customized error messages to the client.
The goal of the tutorial is to teach the user how to how to load their YouTube profile onto Flash Media Live Encoder.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

733 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question