I actually did it by adding another div and using a callback function. I'm not sure if this is very readable, but it looks something like this: <script type="text/javascript">
$(document).ready(function(){
$("a.video_show").click(function(){
$("div#video").slideDown("normal",function(){
$("div#video_player").css("display","block");
});
return false;
});
$("a#hide_video").click(function(){
$("div#video_player").css("display","none");
$("div#video").slideUp();
return false;
});
});
</script>
// the video player
<div id="video" style="display:none;">
<div id="close_video"><a href="#" id="hide_video" class="video_hide">X</a></div>
<div style="height:202px;">
<div id="video_player" style="display:none;">
<?php include("video.php"); ?>
</div>
</div>
// link that initiates the video
<a href="#" class="video_show"><img src="img/video.png" alt="Play Video" />Video</a>
</div>
