允许页面显示特定部分的响应iframe



我从各种来源收集了这些代码,以允许嵌入页面特定部分的iframe:

<style type="text/css">
body {background:transparent;
height:2000px;
width:870px;
}
</style>
<div style="border: 1px solid rgb(250, 0, 0); overflow: hidden; margin: 0px auto; max-width: 900px;">
<iframe scrolling="no" src="https://https://sites.google.com/site/yourcommentsite/test" style="border: 0px none; margin-left: -15px; height: 9999px; margin-top: -365px; width: 900px;">
</iframe>
</div>

此处解释此代码的原因:https://sites.google.com/site/yourcommentsite/

第一部分是关于iframe的透明度,在将包括iframe在内的小工具内部(除非它在小工具中,否则不能与谷歌网站一起使用)。然后我做了一个红边的"窗口",其中包括一个网站的iframe。我调整iframe的大小并将其相对于"窗口"定位,并嵌入了注释部分。这段代码嵌入了一个宽度为900px、长度为9999px的iframe。

这是用于谷歌网站,允许嵌入另一个谷歌网站页面的特定部分。

问题是:它没有响应能力,所以操作有点复杂,而且取决于用户的屏幕分辨率,所以试图使用它的人会制作一个固定大小的iframe,而其他显示器会切割iframe或使其过小。如果iframe被剪切/溢出,则会出现滚动条,但这不是最干净的解决方案。

我想让它做出响应,但我看到的解决方案无法让它们在"窗口"中工作,因为"窗口"只允许获取网站的特定部分。

我对编码几乎一无所知,所以你能帮我找到一个解决方案吗?

此外,将javascript添加到Google站点非常困难,而且它不允许src="xxxx.js"或"xxxx.css".

谢谢!

看看我的例子http://jsfiddle.net/7k3sscdk/.这是通过将所有内容的高度和宽度设置为100%来实现的。但是,如果iframe所指向的网站没有响应,那么您也无法在您的网站上使iframe内容响应。

<iframe src='http://www.example.com' style='border: 0;' width='100%' height='100%' scrolling='no'></iframe>

最新更新