我需要做以下事情：
任何人都可以帮忙吗？
我无法使用的东西：
位置：固定;（主要是由于我用于侧边栏的脚本
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Bus Management System</title>
<!-- Viewport meta tag to prevent iPhone from scaling our page -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(function(){
var iFrames = $('iframe');
function iResize() {
for (var i = 0, j = iFrames.length; i < j; i++) {
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
}
if ($.browser.safari || $.browser.opera) {
iFrames.load(function(){
setTimeout(iResize, 0);
});
for (var i = 0, j = iFrames.length; i < j; i++) {
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
} else {
iFrames.load(function() {
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}
});
</script>
</head>
<style type="text/css" media="all">
html, body, iframe {width:100%; height:100%;box-sizing:border-box; margin:0; padding:0; border:0;}
body {border:4px solid green;}
iframe {border:6px solid red;width:100%; height:100%;display:block;}
#wrapper {border:2px solid blue; width:100%; height:100%;}
</style>
<body>
<div style="height:50px; background-color:#000; color:#fff;">Header</div>
<iframe src="http://www.google.com" style="width:100%; height:100%;" onLoad="calcHeight();"></iframe>
</body>
</html>
答案 0 :(得分：10)
仅针对100％宽度和高度的CSS解决方案
HTML
<div class="container">
<div class="h_iframe">
<iframe src="//www.youtube.com/embed/9KunP3sZyI0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
CSS
html,body {
height:100%;
}
.h_iframe iframe {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
没有位置：绝对
CSS
html,body {height:100%;}
.h_iframe iframe {width:100%; height:100%;}
.h_iframe {
height: 100%;
}
最后这里是破解
现代浏览器现在支持：
width: calc(100% - 70px);
CSS
html,body {
height:100%;
margin-top:0;
margin-bottom:0;
}
.h_iframe iframe {
width:100%;
height:calc(100% - 75px);
}
.h_iframe {
height: 100%;
}
.element{
width:100%;
height:70px;
background:red;
}
HTML
<div class="container">
<div class="element">here it goes</div>
<div class="h_iframe">
<iframe src="//www.youtube.com/embed/9KunP3sZyI0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
答案 1 :(得分：0)
通常你设置iframe的宽度和高度。如果里面的内容更大，滚动条必须足够。下面的脚本尝试通过动态调整iframe大小来适应它加载的内容来解决这个问题。
您可以使用此功能使用jquery / javascript
设置自动高度<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(function(){
var iFrames = $('iframe');
function iResize() {
for (var i = 0, j = iFrames.length; i < j; i++) {
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
}
if ($.browser.safari || $.browser.opera) {
iFrames.load(function(){
setTimeout(iResize, 0);
});
for (var i = 0, j = iFrames.length; i < j; i++) {
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
} else {
iFrames.load(function() {
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}
});
</script>
你的iframe html就像这样
<iframe src="http://www.google.com" class="iframe" scrolling="no" frameborder="0"></iframe>
答案 2 :(得分：0)
简单干净。 jQuery是必需的。资料来源：https://stackoverflow.com/a/3940802
修改了一下
function iframeHeight() {
var newHeight = $(window).height();
var newWidth = $(window).width();
var buffer = 100; // space required for any other elements on the page
var newIframeHeight = newHeight - buffer;
$('iframe.fop').css('height',newIframeHeight).css('width',newWidth); //this will aply to all iframes on the page, so you may want to make your jquery selector more specific.
}
// When DOM ready
$(function() {
window.onresize = iframeHeight;
iframeHeight();
});<iframe src="" target="_parent" width="100%" height="100%" class="fop"></iframe>
答案 3 :(得分：0)
大众汽车可以正常工作（已在Chrome和Firefox上测试）
iframe{
width:100vw;
}
答案 4 :(得分：0)
您可以尝试执行以下操作：
# Import some stuff
import matplotlib.pyplot as plt
import matplotlib.dates as mdates
from datetime import datetime
import pathlib
from pathlib import Path
import moviepy.editor as mpy
# Define Input
x = [2.803480599999999, 5.5502475000000056, 6.984381300000002, 4.115224099999998, 5.746583699999995, 8.971469500000019,
12.028179500000032, 13.451193300000014, 12.457393999999972, 12.027555199999998, 16.077930800000015,
5.021229700000006, 11.206380399999999, 7.903262600000004, 11.98195070000001, 12.21701, 10.35045,
10.231890000000002]
y = [11.961321698938578, 5.218986480632915, 5.211628408660906, 4.847852635777481, 4.936266162218553, 5.233256380128127,
5.441388698929861, 5.461721129728066, 5.722170570613203, 5.2698434785261545, 5.645419662253215, 4.617062894639794,
4.973357261130752, 5.906843248930297, 5.256517482861392, 5.537361432952908, 5.339542403148332, 5.376979880224148]
t_string = ['2019-10-7', '2019-10-13', '2019-11-10', '2019-11-16', '2019-11-17', '2019-11-23', '2019-11-24',
'2019-11-27', '2019-12-1', '2019-12-4', '2019-12-8', '2019-12-21', '2019-12-23', '2019-12-25', '2019-12-27',
'2020-1-2', '2020-1-5', '2020-1-9']
# Define a function to get the datafiles with a certain suffix in a path
def getfile_UI(file_directory, file_suffix):
from glob import glob
path_to_search = file_directory / file_suffix
filenames = glob(str(path_to_search))
return filenames
# Start of script/calculations
t = [mdates.date2num(datetime.strptime(i, "%Y-%m-%d")) for i in t_string]
workingdirectory_projectfolder = Path.cwd().parent
my_dpi = 75
for index, entry in enumerate(t_string):
fig = plt.figure(figsize=(480 / my_dpi, 480 / my_dpi), dpi=my_dpi)
sc = plt.scatter(x[0:index + 1],
y[0:index + 1],
c=t[0:index + 1])
plt.xlim(0, 20)
plt.ylim(4, 7)
plt.title(entry)
plt.xlabel("Distace [km]")
plt.ylabel("Pace [min/km]")
loc = mdates.AutoDateLocator()
fig.colorbar(sc, ticks=loc,
format=mdates.AutoDateFormatter(loc))
filename = 'png_' + str(index) + '.png'
new_dir = workingdirectory_projectfolder / "type 3 gif"
pathlib.Path(new_dir).mkdir(exist_ok=True)
plt.savefig(workingdirectory_projectfolder / "type 3 gif" / filename, dpi=96)
plt.gca()
# Make a GIF from all png files
# http://superfluoussextant.com/making-gifs-with-python.html
fps = 10
gif_name = str(fps) + " fps_""type3_"
workingdirectory_projectfolder = Path.cwd().parent
gif_path = workingdirectory_projectfolder / "type 3 gif" / gif_name
filenamelist_path = workingdirectory_projectfolder / "type 3 gif"
filenamelist_png = getfile_UI(filenamelist_path, "*.png")
list.sort(filenamelist_png, key=lambda x: int(
x.split('_')[1].split('.png')[0])) # Sort the images by #, this may need to be tweaked for your use case
clip = mpy.ImageSequenceClip(filenamelist_png, fps=fps)
clip.write_gif('{}.gif'.format(gif_path), fps=fps)
答案 5 :(得分：0)
通过计算9/16-0.5625，我从YouTube获得了比例为6:19的视频帧->。乘以95vw（也可以设置为100vW）。
尽最大努力保持视频比例不变。
@media all and (max-width: 730px) {
iframe{
width: 95vw !important;
height: calc(95vw*0.56) !important;
}
}
iframe{
margin:auto;
display:block;
width:685px;
height:385px;
} <iframe id="video" allowfullscreen src="https://www.youtube.com/embed/5Mdy8nBBbQQ?autoplay=1"></iframe>
答案 6 :(得分：-1)
这对我有用
<iframe frameborder="0" height="490" scrolling="no" src="" width="735"></iframe>