在SquareSpace&上嵌入Google电子表格使其响应移动

时间:2017-08-30 18:00:57

标签: html5 iframe google-sheets embed squarespace

我正在尝试在Square Space网站上嵌入谷歌电子表格。不幸的是,每当我切换到移动视图时,我得到的电子表格都有水平和垂直滚动条

<div class="sqs-block-content">
<iframe width="100%" height="800" src="https://docs.google.com/spreadsheets/d/1BxfLMwwEWjyV-Avp9cWupPnJiwVq3GX6VcVRYuw-XQ0/pubhtml?single=false&widget=false&headers=false" scrolling="no" ></iframe>
</div>

如何使电子表格响应以便它适合iframe(因此,所有列都不可见,因此没有滚动条)?

修改
是否可以使用jquery操作内部html(iframe的html主体)?我相信应该有办法或某种方式来实现我想要的。 我尝试了一些jquery库,但仍然没有运气......

1 个答案:

答案 0 :(得分:0)

如果您想缩小<iframe>尺寸,请尝试以下操作:

  • width="100%" height="800"
  • 中删除<iframe>

然后,以下内容添加到您的CSS:

iframe {
    width: 396vw;
    height: 3200px;
    border: 0;
    transform: scale(0.25);
    transform-origin: 0 0;
}