如何在 html 中使用 jQuery css 将显示图像的视频放在图像前面？

Question

as example i need to put the image in center of image as http://www.press75.com/themes/video-elements-theme-demo/

on the web-page code check that page exist with video or not if yes then they wrap the image with anchor tag

<img src="myimage" alt=""/>

if image found that it's goes like

<a href="embedelink" id="videofound">    <img src="myimage" alt=""/></a>

now if link open that open a fancybox who show the video in it. now i have a problem that someone can show me the css that it's show the play image in middle of image as demo shows.

how i can put the css than their is no problem come. well in m case the image is bigger then height="367" width="550"

can somone show me the css for that.

thanks

Answer 1

If using Jquery Have a look at http://fancybox.net/

code extract from http://fancybox.net/howto

$(document).ready(function() {

    /* This is basic - uses default settings */

    $("a#single_image").fancybox();

    /* Using custom settings */

    $("a#inline").fancybox({
        'hideOnContentClick': true
    });

    /* Apply fancybox to multiple items */

    $("a.group").fancybox({
        'transitionIn'  :   'elastic',
        'transitionOut' :   'elastic',
        'speedIn'       :   600, 
        'speedOut'      :   200, 
        'overlayShow'   :   false
    });

});