Question

我有各种来源的代码，以便嵌入页面特定部分的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的小工具内部（除非在小工具中，否则不适用于Google网站）。然后我创建一个红色边框“窗口”，其中包含一个网站的iframe。我调整iframe的大小并将其相对于“窗口”定位，并嵌入了注释部分。此代码嵌入了900px宽和9999px长的iframe。

这适用于Google协作平台，允许嵌入其他Google网站的特定部分页面。

问题是：它没有响应，因此说明有点复杂并且取决于用户的屏幕分辨率，所以试图使用它的人将制作一个固定大小的iframe，而其他显示器会切断iframe或者也是如此小。如果iframe被切断/溢出，则会出现滚动条，但这不是最干净的解决方案。

我想让它具有响应性，但我看到的解决方案无法让它们与允许仅获取网站特定部分的“窗口”一起使用。

我对编码几乎一无所知，你能帮我找到解决方案吗？

此外，向Google协作平台添加javascript非常困难，并且不允许使用src =“xxxx.js”或“xxxx.css”。

谢谢！

Answer 1

在http://jsfiddle.net/7k3sscdk/查看我的示例。这可以通过将所有内容的高度和宽度设置为100％来实现。但是，如果iframe指向的网站没有响应，则您无法在您的网站上对iframe内容做出响应。

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

允许页面特定部分的响应iframe - 如何？

1 个答案: