在wordpress中使用javascript在flash和iframe版本的直播Ustream之间切换
Switching between flash and iframe version of live streaming Ustream with javascript in wordpress
我正在尝试制作一个按钮,用于在我嵌入个人网站的ustream直播频道的flash版本和iframe版本之间切换
闪存代码:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="392" id="utv786564"><param name="flashvars" value="autoplay=false&brand=embed&cid=3064708"/><param name="allowfullscreen" value="true"/><param name="allowscriptaccess" value="always"/><param name="movie" value="http://www.ustream.tv/flash/viewer.swf"/><embed flashvars="autoplay=false&brand=embed&cid=3064708" width="640" height="392" allowfullscreen="true" allowscriptaccess="always" id="utv786564" name="utv_n_665786" src="http://www.ustream.tv/flash/viewer.swf" type="application/x-shockwave-flash" /></object>
iframe代码:
<iframe width="640" height="392" src="http://www.ustream.tv/embed/3064708?v=3&wmode=direct" scrolling="no" frameborder="0" style="border: 0px none transparent;"> </iframe>
<br /><a href="http://www.ustream.tv" style="font-size: 12px; line-height: 20px; font-weight: normal; text-align: left;" target="_blank">Broadcast live streaming video on Ustream</a>
对于这个范围,我使用以下代码:
javascript:
var newHTML = 'html2';
var oldHTML = document.getElementById('divtabone').innerHTML;
function changeText3(){
var currentHTML = document.getElementById('divtabone').innerHTML;
if (currentHTML!=newHTML)
{
document.getElementById('divtabone').innerHTML = newHTML;
}
else
{
document.getElementById('divtabone').innerHTML = oldHTML;
}
}
html:
<div id='divtabone'>html1</div>
<input type='button' onclick='changeText3()' value='change Html'/>
用上报告的flash和iframe代码替换html1和html2
工作演示:
https://jsfiddle.net/nqj2L07j/2/
我已经在我的测试网站wordpress:中插入了这段代码
http://www.grigione.5gbfree.com/test/
但是当我点击更改html按钮时,我怎么能看到我可以一次将视频从flash版本更改为iframe版本,因为如果我重新点击我想回到flash版本,它仍然是iframe版本我在这里用代码做了一个演示:
https://jsfiddle.net/z36e77ru/1/
我在wordpress的functions.php文件中插入的代码如下:
function mia_on_load_script()
{
// Not our page, do nothing
if( !is_page( 'test' ) )
return;
?>
<script type="text/javascript">
var newHTML = '<div id="1" style="margin-left: 0px; padding: 0px; float: left; width: 640px; height: 392px; border: 0px;"><iframe width="640" height="392" src="http://www.ustream.tv/embed/3064708?v=3&wmode=direct" scrolling="no" frameborder="0" style="border: 0px none transparent;"></iframe></div><div id="2" style="margin-left: 0px; padding: 0px; float: left; width: 320px; height: 392px; border: 0px;"><iframe style="border: 0 none transparent;" src="//www.ustream.tv/socialstream/3064708" width="320" height="392" frameborder="no"></iframe></div>';
var oldHTML = document.getElementById('divtabone').innerHTML;
function changeText3(){
var currentHTML = document.getElementById('divtabone').innerHTML;
if (currentHTML!=newHTML)
{
document.getElementById('divtabone').innerHTML = newHTML;
}
else
{
document.getElementById('divtabone').innerHTML = oldHTML;
}
}
</script>
<?php
};
add_action( 'wp_head', 'mia_on_load_script' );
?>
页面中的htmlhttp://www.grigione.5gbfree.com/test/:
<div id="divtabone"><div id="1" style="margin-left: 0px; padding: 0px; float: left; width: 640px; height: 392px; border: 0px;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="360" id="utv786564"><param name="flashvars" value="autoplay=false&brand=embed&cid=3064708"/><param name="allowfullscreen" value="true"/><param name="allowscriptaccess" value="always"/><param name="movie" value="http://www.ustream.tv/flash/viewer.swf"/><embed flashvars="autoplay=false&brand=embed&cid=3064708" width="640" height="360" allowfullscreen="true" allowscriptaccess="always" id="utv786564" name="utv_n_665786" src="http://www.ustream.tv/flash/viewer.swf" type="application/x-shockwave-flash" /></object></div> <div id="2" style="margin-left: 0px; padding: 0px; float: left; width: 320px; height: 392px; border: 0px;"><iframe style="border: 0 none transparent;" src="//www.ustream.tv/socialstream/3064708" width="320" height="392" frameborder="no"></iframe></div></div>
<input type='button' onclick='changeText3()' value='click to change'/>
为什么wordpress不起作用?冷是缓存的问题吗?有其他解决方案吗?感谢
嗨,所以我对你的问题进行了另一次调查。如果你这样尝试会发生什么?
试试这把小提琴:https://jsfiddle.net/nqj2L07j/6/
var flash = '<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="640" height="392" id="utv786564"><param name="flashvars" value="autoplay=false&brand=embed&cid=3064708"/><param name="allowfullscreen" value="true"/><param name="allowscriptaccess" value="always"/><param name="movie" value="http://www.ustream.tv/flash/viewer.swf"/><embed flashvars="autoplay=false&brand=embed&cid=3064708" width="640" height="392" allowfullscreen="true" allowscriptaccess="always" id="utv786564" name="utv_n_665786" src="http://www.ustream.tv/flash/viewer.swf" type="application/x-shockwave-flash" /></object>';
var iframe = '<iframe width="640" height="392" src="http://www.ustream.tv/embed/3064708?v=3&wmode=direct" scrolling="no" frameborder="0" style="border: 0px none transparent;"> </iframe><br /><a href="http://www.ustream.tv" style="font-size: 12px; line-height: 20px; font-weight: normal; text-align: left;" target="_blank">Broadcast live streaming video on Ustream</a>';
var is_flash = true;
$(document).ready(function () {
$('#btn1').click(function () {
if (is_flash) {
$('#divtabone').html(iframe);
is_flash = false;
} else {
$('#divtabone').html(flash);
is_flash = true;
}
});
});
相关文章:
- 将电视直播频道从网站嵌入我的网站
- Magento网站上线直播服务器只显示主页
- 基于Jquery的所见即所得,具有直播的可能性
- 在wordpress中使用javascript在flash和iframe版本的直播Ustream之间切换
- 使用 YouTube 直播 API 设置提取设置
- 使用highchart直播多个系列
- Ustream API not working?
- 用于直播的网络音频API
- Youtube视频是一个直播
- 有没有办法在直播时调整图像大小
- 网络音频API-直播'点击'块之间
- 事件侦听器不适用于 Ustream API
- 更改图像取决于Twitch频道是否直播
- Javascript幻灯片在本地工作,但当直播时,它显示所有静态图像
- 如何在使用javascript点击直播聊天时引发事件
- Facebook直播功能
- 禁用右键单击嵌入的直播flash对象
- 苹果取消了直播shoutcast&ios 6上的icecast仅适用于web应用程序
- 两个浏览器之间的音频/视频直播,哪些技术
- 我如何使两个徽章(给直播频道的状态)每分钟自动刷新