1

我正在尝试获取一个对象(嵌入式抽搐流)以显示单击图像的时间。除非我尝试更改其显示属性,否则一切似乎都运行良好。它display: none;默认设置为,并且应该在display: block;单击时更改为。

HTML

<object id="twitchStream" class="center" .... </object>
<a href="#" onClick="showDiv()"><img class="center" src="img/hsl_arrow.png" /></a>

CSS

#twitchStream{
    display: none;
}

object.center{
    margin-left: auto;
    margin-right: auto;
    width: 620px;
}

JavaScript

function showDiv() {
    document.getElementById('twitchStream').style.display = "block";
}

编辑

对象的内容

<object id="twitchStream" class="center" 
type="application/x-shockwave-flash" height="378" 
width="620" id="live_embed_player_flash" data="http://www.twitch.tv/widgets/
live_embed_player.swf?channel=hsstarleague" bgcolor="#000000"><param 
name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="always" /><param name="allowNetworking" value="all" />
<param name="movie" value="http://www.twitch.tv/widgets/live_embed_player.swf" />
<param name="flashvars" value="hostname=www.twitch.tv&channel=hsstarleague&auto_play=true&start_volume=25" /></object>

我很抱歉格式化,我复制并粘贴它并且遇到了一些问题。

4

3 回答 3

1

尝试用以下代码替换您的 JavaScript 代码:

window.showDiv = function() {
  document.getElementById('twitchStream').style.display = "block";
}

小提琴:http: //jsfiddle.net/3rCHJ/

PS 请不要在生产环境中这样做——污染全局命名空间非常非常糟糕。

于 2013-10-25T01:48:36.597 回答
1

理论上,对象应该可以使用 css 属性设置样式。但是像 flash 和 java applet 这样的对象是由它们各自的代码绘制的,有时浏览器并没有太多的控制权。

一种解决方案是将您的对象放在自己的 div 中,然后隐藏该 div。众所周知,这个技巧非常可靠,应该适用于 flash:

<div id="twitchStream">
    <object id="twitchStreamObject">...</object>
</div>

现在您的代码应该可以正常工作了。

于 2013-10-25T03:30:45.530 回答
-1

如果您不介意使用 jQuery,这里是一个简单的解决方案

function showDiv(){
   $('#twitchStream').show();
};
于 2013-10-25T01:41:53.243 回答