Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Fancybox Inline problem


Hello,

i make an example to play .flv with the jw player in a fancybox Inline mode.

================================
<a id="inline" href="#data">This shows content of element who has id="data"</a>

<div style="display:none"><div id="data">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<script type='text/javascript' src='/files/js/swfobject.js'></script>

<div id='mediaspace'>This text will be replaced</div>
<script type='text/javascript'>
var so = new SWFObject('/files/js/player.swf','ply','470','320','9','#000000');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('file','/files/flying.flv');
so.addVariable('stretching','fill');
so.addVariable('autostart','true');
so.addVariable('width', '470');
so.addVariable('height', '320');

so.write('mediaspace');
</script>


Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div></div>
=====================================

Wenn i open the inline box the video plays without problems in IE/OPERA/MOZ - but...

IE:
But when i close the inline box and open it agein - the video don't play anymore. i can click to play but nothing happend and the timeline is on same time before i closed it for example 3:34min.
This problem just in IE and when i refresh the site it works

OPERA & MOZ:
When i cklick on the Timeline to move forward - it closed the inline box


SORRY FOR MY BAD ENGLISH AND I HOPE U UNDERSTAND

anyone had similar problems?


Thanks so much

29 Community Answers

Ethan Feldman

JW Player Support Agent  
0 rated :

We don’t have any experience with FancyBox, but we have our own LightBox – http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v4/21/jw-box-the-jw-player-lightbox

JW Player

User  
0 rated :

Thanks for the reply.

That's what I thought too, but would be nice if it worked with fancybox because i've many funtions ready in my website with fancybox - just the videofunction breaks.

But If there is no alternative so i must use the LightBox.It's enough for that i need but i don't like it really to have so much diffrent kinds of scripts :)

Thanks again

perhaps other one has a solution

bye
southi

JW Player

User  
0 rated :

Sorry have forgotten something.

i must correct something.

in IE i can press play but nothing happends - i thought - know turn my speaker on and i can hear the sound of the film but picture is just black.
i can turn to fullscreen - same problem.
Volume up/down works also.

Sorry

bye

Ethan Feldman

JW Player Support Agent  
0 rated :

I am not sure…FancyBox is not our product…

JW Player

User  
0 rated :

Ethan, I'm experiencing the same problem as Southi with JW Player, Fancybox, and IE7. In my case, I'm using the JW Embedder rather than SWFObject. I totally understand that Fancybox isn't your product to support, but I do have a specific question that you might be able to answer. Fancybox has a onClosed option that lets you run a callback function when the Fancybox window is closed. Is there a function I could pass here that would somehow reinitialize or unload JW Player so that the page would be in the same state as when it first loaded? I've tried this:

bc.. 'onClosed' : function() {
jwplayer("movie").remove();
}



This successfully removes JW Player from the page, but doesn't reset things to their original state--so when I try running the movie a second time, the JW Player never starts.

Thanks massively for any suggestions you can provide. Like Southi, I'm using Fancybox in a bunch of other places on this site and would love to be able to use a single lightbox script for everything.

Erik

JW Player

User  
0 rated :

Two additional notes:

Tried this also:

bc.. 'onClosed' : function() {
jwplayer("movie").stop();
}



but no dice. :(

Also noticed the problem exists in IE8 as well as IE7.

JW Player

User  
0 rated :

Hi, I also have problems getting it to work in fancyBox with "ajax" mode- Firefox always throws the error:

Error: parent is null
Source File: http://localhost/public/js/jwplayer.js
Line: 229

Most of the time this only happens when I open the box for the second time, so maybe it's related to that reinitializing issue Erik mentioned. I'm also using the embed method, not swfObject.

bye,
Thomas

JW Player

User  
0 rated :

Some progress: I came across this thread: http://www.longtailvideo.com/support/forums/jw-player/bug-reports/16084/jwbox-doesnt-show-video-a-second-time-after-closing-the-box-in-ie8 , which described a similar problem when JW Player is used with its native lightbox script, JW Box.

The suggested fix--setting the "stretching" option to "exactfit"--has partially solved my problem. Now, if I start a video for the first time, it opens in Fancybox and everything is fine--same as before. If I close the Fancybox modal window in the middle of video playback, and then click the video link again to reopen the Fancybox modal window, I now see the video resume playing where it left off (instead of the black space I was seeing before)--but without sound.

Ethan Feldman

JW Player Support Agent  
0 rated :

FancyBox is not our product… , never used it before, sorry.

JW Player

User  
0 rated :

Ethan: fair enough. I was hoping not so much for Fancybox-specific help (which I realize is not your bailiwick) as an answer to my question about whether there was a way to unload/reinitialize JW Player using the JW Embedder API, but it's a moot point now because I've been able to get Fancybox working with Flowplayer.

To others in this thread having issues with IE and JW Player with Fancybox, I'd recommend giving Flowplayer a try and using this code to integrate it with Fancybox: https://gist.github.com/571643 It is working like a charm for me, even in IE7.

Ethan Feldman

JW Player Support Agent  
0 rated :

Example of load – http://developer.longtailvideo.com/player/trunk/fl5/js/test/examples/load.html

JW Player

User  
0 rated :

I'm having a similar problem you guys are - when I re-open the Fancybox window with a video inside, I can't get the video to resume playback. Its not a huge deal since they can still click on the video manually to resume playback, but my various hacks have been unsuccessful.

Ethan - JW Player isn't Fancybox's product either.

Ethan Feldman

JW Player Support Agent  
0 rated :

Yes, I know it is not their product. It is ours. So, we don’t officially support this integration. You should just use our own Lightbox – http://www.longtailvideo.com/support/jw-player/jw-player-for-flash-v4/21/jw-box-the-jw-player-lightbox

JW Player

User  
0 rated :

I found the code to show jwplayer in a fancybox. You need to remove the player each time you close the window. For that you need also to initate this player each time you load the fancy.
I had also a content params in fancy in order not to have an empty div in the html code.
bc.. <script type="text/javascript">
$(document).ready( function(){
$("a.inline").fancybox({
'content':'<div id="video"></div>',
'hideOnContentClick': false,
'scrolling': false,
'titleShow': false,
'autoDimensions': false,
'width': 400, 'height':300,
'padding': 0,
'onComplete': function() {
jwplayer('video').setup({
'flashplayer': 'js/jwplayer/player.swf',
'id': 'player1',
'controlbar.position': 'bottom',
'autostart': true,
'file': this.href
});
},
'onCleanup': function() {
jwplayer('video').remove();
}
});
});
</script>
<a class="inline" href="video/toto.flv">This shows video "toto.flv"</a>
<br />
<a class="inline" href="video/test.flv">This shows video "test.flv"</a>



You just have now to include your js and css librairies and personalise urls.

I wish that will be usefull for you guys.

JW Player

User  
0 rated :

@Oliver

Interesting.

can you provide a link to see this in action?

JW Player

User  
0 rated :

@Olivier

I think it should be


<script type="text/javascript">
$(document).ready( function(){
$("a.inline").fancybox({
'content':'<div id="video"></div>',
'hideOnContentClick': false,
'scrolling': false,
'titleShow': false,
'autoDimensions': false,
'width': 400, 'height':300,
'padding': 0,
'onComplete': function() {
jwplayer('video').setup({
'flashplayer': 'js/jwplayer/player.swf',
'id': 'player1',
'controlbar.position': 'bottom',
'autostart': true,
'file': $('#video').attr('href'),
});
},
'onCleanup': function() {
jwplayer('video').remove();
}
});
});
</script>
<a class="inline" href="video/toto.flv">This shows video "toto.flv"</a>
<br />
<a class="inline" href="video/test.flv">This shows video "test.flv"</a>





Helped me a lot!!

Ethan Feldman

JW Player Support Agent  
0 rated :

Nice, thanks for sharing!

JW Player

User  
0 rated :

FYI, I had the same issue with JW Box as was described above with Fancybox. In IE8, the video worked the first time, but if I closed the modal window/pseudo-window and opened it again, the timeline advanced but no video appeared.

I ended up using Olivier's code with Fancybox.

JW Player

User  
0 rated :

jwplayer('video').remove(); causes problems in IE, I used jwplayer('video').stop(); since the API reference says it Stops the player and unloads the currently playing media file from memory.

Thanks for the script.

JW Player

User  
0 rated :

can you provide a link to check this out?

JW Player

User  
0 rated :

Hi,
I tried the fix but in IE8 it's still not working.
Very weird problem...

I also tried stop() and remove().
But none of those made a difference.

My code:
bc.. $(document).ready(function() {
$("a.inline").fancybox({
'content':'<div id="video"></div>',
'hideOnContentClick': false,
'scrolling': false,
'titleShow': false,
'autoDimensions': false,
'width': 640, 'height':370,
'padding': 0,
'onComplete': function() {
jwplayer('video').setup({
'flashplayer': 'js/player.swf',
'id': 'playerID',
'width': '640',
'height': '360',
'autostart': true,
'file': this.href
});
},
'onCleanup': function() {
jwplayer('video').stop();
}
});
});

JW Player

User  
0 rated :

Hmm strange, so I added

bc.. 'stretching': 'exactfit'



and it seems to work now in IE 8 on Win xp.
It's even working without the onCleanup part.

Ethan Feldman

JW Player Support Agent  
0 rated :

That would do it!

JW Player

User  
0 rated :

The Bits On The Run Javascript embed code looks like this:

<script type="text/javascript" src="http://content.bitsontherun.com/players/videoId-playerId.js"></script>

Has anyone found a way to display a player in Fancybox using this code? I've found that loading the script directly in as content doesn't actually initiate the playerjust an empty div with class "botrplayer". I get the same result when I try to load the script onComplete after fancybox has opened. And no luck using Ajax to load it.

I had success with the BOTR iFrame embed code on desktop browsers, but when accessing the video from iOS, it only loads the html5 player the first time. When the fancybox is opened again, there is just a blank fancybox with no player.

JW Box seems to work fine with the Javascript embed code in Chrome, Safari and Firefox, but when I start the player in IE8, the audio continues playing as described above by Chris Herdt.

I'd prefer to use the BOTR Javascript embed code with FancyBox if I can, but I just havent been able to get it to work.

Ethan Feldman

JW Player Support Agent  
0 rated :

I’ve never tried…

JW Player

User  
0 rated :

Hi Ethan,
I would think that you'd be interested in getting your code to play nicely with other *very* popular scripts.
I've had the same struggle here, getting it to cooperate with fancybox. Your willingness to help your users out with integration goes a long way to advancing the uptake of your products, imho.
Thanks to everyone for the advice and suggestions here!
David.

Ethan Feldman

JW Player Support Agent  
0 rated :

I’ve implemented the player within FancyBox, it works well actually. Just not Bits on the Run embeds. Are you using Bits on the Run?

JW Player

User  
0 rated :

I would like to see a Bits on the run implementation with Fancybox. It would help us out a lot.

Ethan Feldman

JW Player Support Agent  
0 rated :

FacnyBox supports iFrames. Just use a BOTR iFrame inside of Fancybox, it is pretty simple.

This question has received the maximum number of answers.