Создание SWF на SWF с помощью JQuery

Question

У меня есть этот файл JavaScript, который является модифицированной версией скрипта VideoLightBox:

jQuery(function(){
var $=jQuery;
var swfID = "video_overlay";

if(!document.getElementById("vcontainer")){
    $("body").append($("<div id='voverlay'></div>"));
    $("#voverlay").append($("<div id = 'vcontainer'></div>"));
}

$("#videogallery a[rel]").overlay({
    api:true,

    expose: (0?{
        color:'#424542',
        loadSpeed:400,
        opacity:0
    }:null),

    effect:"apple",

    onClose: function(){
        swfobject.removeSWF(swfID);
    },


    // create video object for overlay
    onBeforeLoad: function(){
        // check and create overlay contaner
        var c = document.getElementById(swfID);
        if(!c){
            var d = $("<div></div>");
            d.attr({id: swfID});
            $("#vcontainer").append(d);
        };

        var wmkText="© 2011 BORKH";
        var wmkLink="http://borkh.co.uk";
        c = wmkText? $('<div></div>'):0;
        if (c) {
            c.css({
                position:'absolute',
                right:'38px',
                top:'38px',
                padding:'0 0 0 0'
            });
            $("#vcontainer").append(c);
        };

        // for IE use iframe
        if (c && document.all){
            var f = $('<iframe src="javascript:false"></iframe>');
            f.css({
                position:'absolute',
                left:0,
                top:0,
                width:'100%',
                height:'100%',
                filter:'alpha(opacity=0)'
            });

            f.attr({
                scrolling:"no",
                framespacing:0,
                border:0,
                frameBorder:"no"
            });

            c.append(f);
        };

        var d = c? $(document.createElement("A")):c;
        if(d){
            d.css({
                position:'relative',
                display:'block',
                'background-color':'',
                color:'#626d73',
                'font-family': 'RegisterSansBTNDmRegular, Helvetica, Arial',
                'font-size':'11px',
                'font-weight':'normal',
                'font-style':'normal',
                'text-decoration': 'none',
                padding:'1px 5px',
                opacity:.7,
                filter:'alpha(opacity=70)',
                width:'auto',
                height:'auto',
                margin:'0 0 0 0',
                outline:'none'

            });
            d.attr({href:wmkLink});
            d.html(wmkText);
            d.bind('contextmenu', function(eventObject){
                return false;
            });

            c.append(d);
        }

        // create SWF
        var src = this.getTrigger().attr("href");

        if (typeof(d)!='number' && (!c || !c.html || !c.html())) return;

        if (false){
            var this_overlay = this;
            // if local
            window.videolb_complite_event = function (){ this_overlay.close() };
            // if youtoube
            window.onYouTubePlayerReady = function (playerId){
                var player = $('#'+swfID).get(0);
                if (player.addEventListener) player.addEventListener("onStateChange", "videolb_YTStateChange");
                else player.attachEvent("onStateChange", "videolb_YTStateChange");
                window.videolb_YTStateChange = function(newState){
                    if (!newState) this_overlay.close()
                }
            }
        }

        swfobject.createSWF(
            { data:src, width:"100%", height:"100%", wmode:"opaque" },
            { allowScriptAccess: "always", allowFullScreen: true, FlashVars: (false?"complete_event=videolb_complite_event()&enablejsapi=1":"") },
            swfID
        );

    }
}); });

Скрипт открывает флэш-файл SWF в стиле «всплывающего» лайтбокса и воспроизводит его либо с YouTube, либо через проигрыватель локально. Мне, однако, было интересно, можно ли создать вторичный swf для плавания поверх плеера (отметив, что он, конечно, будет иметь wmode:"transparent") и тем самым создать эффект открывающего занавеса, раскрывающий первого swf и игрока. Я уже довольно давно пытаюсь загрузить верхний клип с помощью createSWF и создать дополнительный div для его хранения и перемещения с использованием абсолютной позиции, однако я не могу понять, что это правильно ... Я знаю, что DIV плавает идеально друг на друга при использовании:

<head>
<style type="text/css" media="screen">
<!--
#bottom{
    position:absolute;
    width: 500px;
    height: 400px;
}
#top{
    position:absolute;
    width:500px;
    height:400px;
    top: 0px;
    left: 0px;
} 
-->
</style>
</head>
<body>
<div id="bottom">
"MAIN CLIP"
  <div id="top">
    "CURTAIN EFFECT"
  </div>
</div>

Однако я не достаточно силен в javascripting для передачи. Любая помощь, идеи, советы или пожелания приветствуются!

Спасибо Andreas

Answer 1

Я думаю, ваша идея сработает, но может стать довольно хитрой.

Вместо этого я бы порекомендовал создать "шторный swf", который вместо этого загружает что-то вроде Chromeless YouTube player внутри него. Таким образом, вы можете listen узнать, когда видео будет загружено / буферизовано, и показать шторки, когда это произойдет.