0

我对这一切都是新手,我肯定会努力变得更好!我试图添加到这个灯箱中的视频是我的新广告:(http://www.gatorgraphix.com/uploads/5/1/7/6/5176322/gator_graphix_commercial.mp4)但我很难把它放进去我的灯箱并自动播放。你能帮我吗??这是我的脚本:

<htmL>
    <head>
        <title>Gator Graphix™ Commercial</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

        <style type="text/css">

        body
        {
             font-family: Helvetica, Arial;
        }

        .backdrop
    {
            position:absolute;
            top:0px;
            left:0px;
            width:100%;
            height:100%;
            background:#000;
            opacity: .0;
            filter:alpha(opacity=0);
            z-index:50;
            display:none;
        }


        .box
        {
            position:absolute;
            top:20%;
            left:30%;
            width:640px;
            height:310px;
            background:#ffffff;
            z-index:51;
            padding:10px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            -moz-box-shadow:0px 0px 5px #444444;
            -webkit-box-shadow:0px 0px 5px #444444;
            box-shadow:0px 0px 5px #444444;
            display:none;

        }

        .close
        {
            float:right;
            margin-right:6px;
            cursor:pointer;
        }

        </style>

        <script type="text/javascript">

            $(document).ready(function(){

                $('.lightbox').click(function(){
                     $('.backdrop, .box').animate({'opacity':'.50'}, 300, 'linear');
                     $('.box').animate({'opacity':'1.00'}, 300, 'linear');
                     $('.backdrop, .box').css('display', 'block');

                });

                $('.close').click(function(){
                    close_box();

                });

                $('.backdrop').click(function(){
                    close_box();

                });

            });


            function close_box()
            {
                $('.backdrop, .box').animate({'opacity':'0'}, 300, 'linear', function(){
                        $('.backdrop, .box').css('display', 'none');
                    });
            }

        </script>

    <Head>
    <body>

    <h1>Gator Graphix™ Commercial</h1>
    <a href="#" class="lightbox">Click To View Our New Commercial</a>

    <div class="backdrop"></div>
    <div class="box"><div class="close">x</div>Gator Graphix™ Commercial</div>

    </body>
</html>
4

2 回答 2

0

在玩了几个灯箱脚本之后,我发现 shadowbox - ( http://www.shadowbox-js.com/download.html ) 非常完美。

在此处链接的下载页面上,您可以选择所有播放器类型,这将允许您嵌入 Flash、视频、图像等。

于 2012-07-09T11:38:59.873 回答
0

您可以使用http://iaian7.com/webcode/mediaboxAdvanced

于 2012-07-09T11:33:58.223 回答