3

期望的行为

将托管在 SharePoint Online 上的 Excel 文档嵌入到 HTML 页面中。

实际行为

嵌入加载,但是没有水平滚动条。

获取视口右侧数据的唯一方法是单击一个单元格,然后使用右箭头键向右滚动。

我试过的

我已按照此处的说明进行操作:

https://support.microsoft.com/en-us/office/embed-your-excel-workbook-on-your-web-page-or-blog-from-sharepoint-or-onedrive-for-business-7af74ce6- e8a0-48ac-ba3b-a1dd627b7773

不幸的是,由于租户限制,我无法共享链接来演示该问题,因为似乎没有办法“匿名化”Microsoft 365 共享链接。

下面是一个截图 - 你可以看到有一个垂直滚动条,但没有水平滚动条。

左列和顶行是frozen panes

我希望我应该能够“向右滚动”,就像在 Excel 在线中一样。

在此处输入图像描述

这是使用的嵌入代码的格式:

<iframe height="500" width="100%" frameborder="0" scrolling="no" src="https://my-tenant.sharepoint.com/:x:/s/site-name/********?e=*****s&action=embedview&wdHideSheetTabs=True&wdAllowInteractivity=False&wdHideGridlines=True&wdDownloadButton=True"></iframe>

我不认为这是一个可以通过将 iframe 包装在具有某种溢出属性的 div 中来解决的问题 - 似乎iframe 嵌入本身内的水平滚动条没有显示。

4

2 回答 2

2

此错误现已修复。

感谢您提供如此详细的反馈;这对我们快速解决问题非常有帮助。

Rotem
Excel 项目经理

于 2020-08-13T12:56:10.403 回答
2

Microsoft 支持为我做了一些超出范围的故障排除,并说他们可以看到水平滚动条一会儿,然后它就消失了。

这让我查看了 Chrome 开发人员工具中的元素,我可以看到水平滚动条未显示的原因是因为在其上方放置了一个 div(该 div 来自 Microsoft 嵌入代码)。

以下是在 Chrome 开发者工具中更改元素 CSS 属性的屏幕截图:

border: 1px solid red...

在此处输入图像描述

display:none...

在此处输入图像描述

后一种更改允许水平滚动条可见(所需的行为)。

但是没有办法在 iframe 中覆盖 CSS。

供参考,相关样式为:

.ewa-stb-ltr.skeleton-sheet-bar-old, .ewa-stb-rtl.skeleton-sheet-bar-old {
    background-color: #F4F4F4;
    position: absolute;
    height: 27px;
    width: 100%;
    z-index: 1051;
    display: none; /* <--- adding this in chrome dev tools makes horizontal scrollbar visible */  
}
于 2020-07-16T12:10:27.793 回答