Question

I have a simple problem… maybe i’m sleep deprived and not seeing what it is…

Basically, I have an image, click an image, show a youtube video. Simple right?

Here’s my css…

<style type="text/css">

#movie { display: none; }

</style>

js…

$(document).ready(function(){

    $('#show_movie').click(function(){

            $(this).hide();
            $('#movie').show();


    });

});

and

<img id="show_movie" src="/img/site-inside.jpg" />          

<object id="movie" width="425" height="344"><param name="movie" value="http://www.youtube.com/v/WDgm6YaApEY?hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/WDgm6YaApEY?hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>

Is there something about showing a flash object i don’t know about? Because the above code hides the image and does nothing else.

Answer 1

Try to move the movie id out of your css and add $(‘#movie’).hide(); above the function that is supposed to let it apear.