Lightbox interaction

Without seeing more code, I can only guess.

If you wrap your JW Media Player code in a function, you can call it from a link like this (goes in the head element of your HTML doc.):

If you really want to allow the Flash Player true fullscreen, the minimum version you need to specify is 9,0,115,0. Otherwise your users won't be prompted to upgrade their Flash Player to use the fullscreen option.var s2 = new SWFObject("/av/app/flvplayer.swf","single","480","380",<strong>"9.0.115"</strong>);
Then, load the player it like this:<a href="#" onclick="javascript:createPlayer(); return false;">Load Player</a>

Well, I am apparently confused. Tried this to only partial success. Loads movie but not the lightbox.

Thoughts?

Well, I don't use lightbox, so I can't help you with that.

If all you want is to have the player appear/disappear when the user clicks on a link, look at this simple implementation: [url=http://willswonders.myip.org:8085/php/SWFObject%20InnerHTML-4.html]Image Rotator[/url] or [url=http://willswonders.myip.org:8085/php/SWFObject%20InnerHTML-5.html]Media Player[/url]

The link can be a button, image, text, etc.

No actually. I'd like the entire page to disappear and focus only the movie.

See the examples at the top of this page: http://videobox-lb.sourceforge.net/

Perhaps you could find some help on the lightbox forums?

Total operator error. I was completely reading the instructions wrong.

Here's an explanation that's a bit clearer: http://iaian7.com/webcode/Mediabox . Actually, it's quite easy.

Sorry. I'll try to think next time.

best,

brian

dssd

Error is the file CSS
Ahahahahah
ahi ahi ahi

<link rel="stylesheet" href="css/videobox.css" type="text/css" media="screen" />

Bravoooooooooooo

<script language="javascript" type="text/javascript" src="/av/app/mootools.js"></script>
<script language="javascript" type="text/javascript" src="/av/app/videobox.js"></script>
<script language="javascript" type="text/javascript" src="/ads/swfobject.js"></script>
<link rel="stylesheet" href="css/videobox.css" type="text/css" media="screen" />

<script type="text/javascript">
function createPlayer()
{
var s2 = new SWFObject("/av/app/flvplayer.swf","single","480","380","9.0.115");
s2.addParam("allowfullscreen","true");
s2.addVariable("width","480");
s2.addVariable("height","380");
s2.addVariable("backcolor","0x000000");
s2.addVariable("frontcolor","0xCCCCCC");
s2.addVariable("lightcolor","0x557722");
s2.addVariable("file","/av/media/ragan_promo.flv");
s2.addVariable("image","/av/app/preview.jpg");
//s2.write("player10"); *This line goes removed because it generates an error javascript*
}
</script>

<a href="/av/media/ragan_promo.flv" rel="vidbox 800 600" title="caption" onclick="javascript:createPlayer(); return false;">Load Player</a>
___

Now it works fine!
Ahahahah

@Gokikko

Do you know how to make this work with ceebox

http://catcubed.com/tag/jquery/

and with swfobject ver 2.1.

Thanks

I am having a really hard time with this. I tried Gokikko's script and it shows the flash player in the upper left corner , the videobox is dark half way down the page and nothing shows up where it suppose to play the video.

i was confused for an hour about gokikko's example. I'm using ceebox, but ..

since jwplayer support query parameters, you should be able to link to an "swf playing an flv file" simply like this:

<a href="jwplayer/player.swf?file=/av/media/ragan_promo.flv" rel="vidbox 800 600" title="caption">Load Player</a>.

that worked for me.

(this particular example in ceebox would require a
$(document).ready(function(){$(".vidbox").ceebox()}
ofcourse)

$2c,
*-pike

Did anyone get ceebox working with jwplayer?

hi guys this is a wee bit of code i use for a light box simple and easy to use very javascript light so fast load on the page works on all browsers i have tested so far.

if works for you just give me a thanks:)

just rember to point the right locations for the movies and the swf object.


<script type="text/javascript" src="../Scripts/swfobject.js"></script>

<style type="text/css">

.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}

.white_content {
display: none;
position: absolute;
top:200px;
left:25%;
right:25%;
margin: 0 auto;
width: 520px;
height: 300px;
padding: 20px;
border: 10px solid black;
background-color: white;
z-index:1002;
overflow: hidden;
}

</style>

<script type='text/javascript'>

function ChooseMovie(){
var jMovieLocation = document.getElementById('MoviePreview');
var jMovie = jMovieLocation.value;
alert(jMovie)

}
var so = new SWFObject('../player.swf','ply','520','292','9','#000000');
so.addParam('allowfullscreen','true');
so.addParam('allowscriptaccess','always');
so.addParam('wmode','opaque');
so.addVariable('autostart','true');
so.addVariable('stretching','exactfit');
so.addVariable('file', jMovie);
so.write('mediaspace');

</script>

<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">X Close</a></div>
</div>
<div id="fade" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'" class="black_overlay"></div>

<input type="image" id='MoviePreview' value="YOURVIDEOHERE" src="YOUR IMAGE HERE" onclick="document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block';ChooseMovie('');"

<code>

Thanks David! Looks great!