Solved

Combination jquery Cycle and Flash banner

Posted on 2010-09-14
8
1,442 Views
Last Modified: 2012-08-13
I have implemented jQuery Cycle to a page, http://jquery.malsup.com/cycle/
Now I wonder if its possible to add a .swf to one of the slides and while the flash finishes playing have the cycle paused.
Is this possible?
If its not possible is there a similar cycle plugin that works with flash that I should look into?
Thank you in advance.



 
0
Comment
Question by:ShopSetup
  • 3
  • 3
  • 2
8 Comments
 
LVL 14

Expert Comment

by:Dushyant Sharma
ID: 33670415
I believe you can set a javascript variable from the flash which will tell the javascript about the time of flash. Once done the javascript animation can move ahead. You can use check the variable with settimeout. This is just an idea, may be you can develop something out of it.
0
 
LVL 15

Expert Comment

by:StealthyDev
ID: 33670503
You can use flash interaction APIs to start a Flash object and then check whether the object is playing or not..

See: http://www.coldfusionmx.com.br/support/flash/publishexport/scriptingwithflash/scriptingwithflash_03.html

Warm Regards.
0
 

Author Comment

by:ShopSetup
ID: 33677358
Thanks to both of you for your reply.
I Found this on how to pass and get variables between flash and Javascript, http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/external/ExternalInterface.html

Is this the way to go?

Added a swf to a slide in Cycle, running it with swfobject and from what I can notice the flash doesn't play in the background when its not showing. Animation starts when slide loads. Not really sure if this is just a lucky coincidence.... Anyone know?

So now I need to figure out :

- How to pause the slideshow on a slide with a specific ID attached to it.
( From the demos I only see how to pause the animation when user clicks on a button)
- How do  I continue with the slideshow after SWF has finished playing.



0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 14

Accepted Solution

by:
Dushyant Sharma earned 250 total points
ID: 33679320
try using WMODE="transparent" (or ="opaque") parameters to send it to background.

It would not be a good idea to stop the slideshow else it will start from the beginning once the flash stops so you should pause it instead of stop.

To pause  the slideshow, you 'll have to give specific id or class and will have to tweak the cycle plugin to stop on the arrival of particular id or class. The simple command to pause the slideshow is $('#slideshow').cycle('pause');

You may also find a way to capture the event like change of display to be used for pausing the animation. This will save you from tweaking the plugin.

To continue the slideshow after SWF has finished playing you need to call a javascript function at the end of SWF.

0
 
LVL 15

Expert Comment

by:StealthyDev
ID: 33679521
0
 

Author Comment

by:ShopSetup
ID: 33679576
Thanks once again for answering my questions.
Think I need to be more specific.

What I need is getting pointed in the right direction howto accomplish the following:

In my Cycle I have 4 slides. Slide 1-2 have html content (img + header),
Slide 3 is a SWF and slide 4 is html content.

Slide 3 have id="#ad". When cycle loads the div with id "ad" I want it to pause the slideshow
and start the flash.
Last frame in teh timeline of the flash banner in the end of the flash I need to have flash telling jQuery Cycle to $('#slideshow').cycle('play');

Thank you in advance.
0
 
LVL 15

Assisted Solution

by:StealthyDev
StealthyDev earned 250 total points
ID: 33680363
@Author: I am here to give you an abstract Idea.

Whenever the slide is changed, a function, "timeoutFn" will be called if you use JQuery-cycle plugin.
In that function you can call:
Plugin.cycle('pause');
FlashObject.Play();

After starting the flash object start a timer (setInterval) to look for the flash object to stop playing using (FlashObject.IsPlaying())
Once FlashObject.IsPlaying() is false, use Plugin.cycle('resume');

Note: for flash interaction:
http://www.permadi.com/tutorial/flashjscommand/
http://www.coldfusionmx.com.br/support/flash/publishexport/scriptingwithflash/scriptingwithflash_03.html

Regards.
0
 

Author Comment

by:ShopSetup
ID: 33687053
Thank you both for your answers.
Have some more testing to do but think I accomplished it finally.

What I did was added a class to my flash div in the cycle.
After every transition I call a function where I check if the div have a specific class.
If true I pause Cycle using Plugin.cycle('pause');

swf starts playing and when done I use ExternalInterface to resume the cycle.

Thank you ddsh79 and senthurpandian for pointing me in the right direction.
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

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

Suggested Solutions

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
The goal of the tutorial is to teach the user how to use the auto adjust feature and what the different options do. When your video is not working right you can choose the auto adjust feature to help choose your settings.
This Micro Tutorial will teach to how to utilize bit rate in Adobe Flash Media Live Encoder.

831 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