我有一个YUI面板,用于在整个网站上显示flash vids。除了IE之外,它在所有的浏览器中运行得非常好(特别是8,因为我不关心其余的)。我正在使用AJAX调用来返回视频库中标签中包含的数据。就像我说的那样,除了IE之外,它在每个浏览器中都很好。这里显示和销毁面板的代码片段:
YAHOO.namespace("MYSITE.widget.VideoPanel");
/**
* @projectDescription MYSITE.widget.VideoPanel is an extension of the YAHOO.widget.Panel widget which adds MYSITE specific options and
* adds ARIA roles if supported
* requires MYSITE.js
* @author web development
* @version 1.0
*/
MYSITE.widget.VideoPanel = function (id, cntnt, type) {
/**
* extend the constructor for YAHOO.widget.Panel
*/
MYSITE.widget.VideoPanel.superclass.constructor.call(this,
id || YAHOO.util.Dom.generateId(),
{
width: "550px",
height:"485px",
fixedcenter:true,
close: true,
underlay:"none",
draggable: false,
modal: true,
zindex:1001,
monitorresize:false,
visible: false
}
);
// since the custom panel inherits from Panel, all its methods and properties are accessible through 'this'
if(cntnt){
this.setHeader("");
this.setBody(cntnt);
this.setFooter("");
}
var keyArray = ((type && type == "dialog") ? [YAHOO.util.KeyListener.KEY.ESCAPE] : [YAHOO.util.KeyListener.KEY.ESCAPE, YAHOO.util.KeyListener.KEY.SPACE]);
var kl = new YAHOO.util.KeyListener(document, { keys:keyArray },
{ fn:this.hide,
scope:this,
correctScope:true }, "keyup" );
// keyup is used here because Safari won't recognize the ESC
// keydown event, which would normally be used by default
this.cfg.queueProperty("keylisteners", kl);
this.render(document.body);
this.body.tabIndex = 0;
if(MYSITE.aria){
this.body.setAttribute("role", "alertdialog");
this.body.setAttribute("aria-hidden", "true");
}
};
/**
* declare the above constructor to inherit from Panel
*/
YAHOO.lang.extend(MYSITE.widget.VideoPanel, YAHOO.widget.Panel,
{
show: function (el){
MYSITE.widget.VideoPanel.superclass.show.call(this);
this.keyingElement = el;
if(MYSITE.aria){
this.body.setAttribute("aria-labelledby", YAHOO.util.Dom.generateId(el));
this.body.setAttribute("aria-hidden", "false");
}
this.body.focus();
},
hide: function (){
var obj =document.getElementById('MediaEmbedObject');
obj.parentNode.removeChild(obj);
MYSITE.widget.VideoPanel.superclass.hide.call(this);
if(MYSITE.aria) this.body.setAttribute("aria-hidden", "true");
this.keyingElement.focus();
}
});
/**
* hide:function closes panel and removes the flash object to stop continual play
*/
YAHOO.register("videoPanel", MYSITE.widget.VideoPanel, {
version: "3.0",
build: "100"
});
以下是获取并显示视频面板内容的代码:
/**
* Function to lazy load, then show the video panel with the content of the link passed in inside the panel
*/
var showVideoPanel = function(e, linkEl){
Event.preventDefault(e);
if(!YAHOO.env.getVersion("videoPanel")) {
var successHandler = function() {
videoPanel = new COUNTRY.widget.VideoPanel("videoPanel", " ");
showVideoPanel(e, linkEl);
};
//this is not likely to go off (404 is not considered an error)
var failureHandler = function() {
window.location = linkEl.href;
return;
};
MYSITE.loadComponent("videoPanel", successHandler, failureHandler);
}
else {
MYSITE.util.Ajax.getRemoteContent('GET', linkEl.href, videoPanel.body, {
success: function(o){
var start, end, el;
el = Dom.get(videoPanel.body);
start = o.responseText.indexOf('<object');
end = o.responseText.indexOf('</noscript>', start);
el.innerHTML = o.responseText.substring(start, end);
},
failure: function(o){
el = Dom.get(videoPanel.body);
el.innerHTML = "The requested content is currently unavailable. Please try again later.";
}
});
videoPanel.show(linkEl);
}
};
最后这是我的AJAX调用返回的内容:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id="MediaEmbedObject" height="425" width="525" data="flash/playerVar1.2.swf" type="application/x-shockwave-flash"><param value="flash/playerVar1.2.swf" name="movie"/><param value="lt" name="salign"/><param value="false" name="loop"/><param value="false" name="menu"/><param value="true" name="allowFullScreen"/><param value="true" name="AutoPlay"/><param value="movieSrc=movieSrc=/flash/financial/mediaPlayer/JBVersion2480x360.flv&skinSrc=flash/CustomSkinPlaySeekVolFull.swf&autoPlay=true 						" name="FlashVars"/><embed allowFullScreen="true" FlashVars="movieSrc=/flash/financial/mediaPlayer/JBVersion2480x360.flv&skinSrc=flash/CustomSkinPlaySeekVolFull.swf&autoPlay=true 						" id="videogalleryObject" height="425" width="525" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="videogalleryObject" quality="high" src="flash/playerVar1.2.swf" AutoPlay="true"/></object></noscript><form name="flashForm" action=""><fieldset><input value="flashVid" name="flashDivId" type="hidden"/><input value="525" name="flashWidth" type="hidden"/><input value="425" name="flashHeight" type="hidden"/><input value="flash/playerVar1.2.swf" name="flashUrl" type="hidden"/><input value="movieSrc=/flash/financial/mediaPlayer/JBVersion2480x360.flv&skinSrc=flash/CustomSkinPlaySeekVolFull.swf&autoPlay=true 						" name="FlashVars" type="hidden" id="playingFlash"/><input value="Flash" name="flashName" type="hidden"/><input value=" Interns" name="flashAltText" type="hidden"/><input value="always" name="allowScriptAccess" type="hidden"/><input value="true" name="allowFullScreen" type="hidden"/></fieldset></form>
我最大的问题是IE拉入标签而不是标签,并且出于某种原因(即使理论上视频仍然应该播放)它也不会在IE中。我让flash播放器显示,有时它甚至会引入所有控件并尝试加载.flv,但最终总是失败。任何想法或建议将不胜感激。
答案 0 :(得分:0)
以下是其中一个参数(flashvars)中aJax调用的片段。它看起来不合适。
<param value="movieSrc=movieSrc=/flash/financial/mediaPlayer/JBVersion2480x360.flv&skinSrc=flash/CustomSkinPlaySeekVolFull.swf&autoPlay=true 						" name="FlashVars"/>
答案 1 :(得分:0)
我们的服务器在通过我们发现的AJAX调用时,正在使用媒体做有趣的事情。之后我们通过vimeo主持我们的视频并使用他们的播放器,该播放器根据用户的浏览器确定播放器的哪个版本以及播放视频的格式。实施的时间更长,这是我们的主要关注点。