我使用jsbin测试一些与iframe相关的代码,这是我工作的链接 http://www.jsbin.com/evidez/1/edit
我错误地将iframe的网址设置为http://stackoverflow.com,现在加载http://www.jsbin.com/evidez/1/edit时会弹出一个警告,关闭后会重定向到http://stackoverflow.com。
我找不到任何方法来编辑我的jsbin代码。
有出路还是我必须重新开始?
答案 0 :(得分:1)
我和我的浏览器搏斗并为你打捞了这个。下次要小心。
HTML
<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title>Full Screen Example</title>
</head>
<body>
<button id="fullsc">set source to iframe and take me full screen</button><br><br>
<iframe id="myvideo" src="http://stackoverflow.com"></iframe>
</body>
</html>
CSS
/* make the video stretch to fill the screen in WebKit */
:-webkit-full-screen #myvideo {
width: 100%;
height: 100%;}
iframe{
position: absolute;
height: 100%;
width:100%
}
的Javascript
var videoElement = $('#myvideo');
var fullsc = $('#fullsc');
function toggleFullScreen() {
if (!document.mozFullScreen && !document.webkitFullScreen) {
if (videoElement.mozRequestFullScreen) {
videoElement.mozRequestFullScreen();
} else {
videoElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else {
document.webkitCancelFullScreen();
}
}
}
document.addEventListener("keydown", function(e) {
if (e.keyCode == 13) {
toggleFullScreen();
}
}, false);
fullsc.onclick = function(){
//setiframeurl();
toggleFullScreen();
};
function setiframeurl(){
$('#myvideo').attr('src', "http://radbox.me/watch/mobile?c=21&du=35");
}