我正在尝试将 div margin-top
设置为屏幕高度的 100%
,但是因为它在 iframe
中 - jQuery 不会无效(返回 0 或不准确的值)。
使用 CSS3 的 100vh
是一种选择,但在一些较旧的和移动浏览器中不受支持。
还有其他解决方案吗?
编辑:
忘了说 - 我只会使用 JavaScript、HTML 和 CSS。
编辑2:
这是一个演示 CodePen
编辑3:
当我在 CodePen 上测试我的代码时 - 结果证明我可以使用 JQuery 获取屏幕高度。那么问题出在哪里呢?
首先我必须提到我在 Tumblr 上使用这段代码,所以它一定是 Tumblr 特有的问题。对于那些不熟悉他们的自定义页面的人来说,它看起来像这样
出于某些我不知道的原因,每当我尝试使用 Jquery 从用户那里获取与浏览器相关的内容时,它总是从“实际页面”而不是从右侧的预览 (iFrame) 获取该信息。那是一些错误的设计。为什么?因为在实际的博客页面上一切正常。
这是我发现的目前有效的解决方法,但我不确定原因。
我使用 $(document).ready 将 JQuery 提供给最终产品(实际的博客页面)——这在自定义页面上不会也不起作用。但是,如果我将相同的代码包装在 $(window).resize 中并仅在自定义页面上提供它,它也可以在那里工作。
有人知道为什么会这样吗?
最佳答案
iframe
的 HTML 文件中的 CSS 怎么样:
html,
body {
height: 100%;
}
div {
margin-top: 100%;
}
关于javascript - 将 div margin-top 设置为屏幕高度(在 iframe 内,跨浏览器),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24100011/