3

我有一个烦人的问题，试图让一个带有谷歌地图的 html 页面正确打印，我有一个谷歌地图，上面有一个 <h2> 全部包裹在一个 div 中，并且 div 设置为'page-break -之前：总是；' 在 css 中，以便地图及其标题始终位于新页面上。

问题是，在 IE8 中，只有在打印时我总是可以看到在前一页上呈现的大部分地图，在前一页上可见的地图部分也是地图可见范围之外的部分。

HTML：

<div id="description">
    <h2>Description</h2>
    <p>Some paragraph of text</p>
    <p>Some paragraph of text</p>
    <p>Some paragraph of text</p>
</div>

<div id="map">
    <h2>Location</h2>
    <div id="mapHolder"></div>
    <script type="text/javascript">
       // ... javascript to create the google map
    </script>
</div>

CSS：

#map { page-break-before:always; }

这是它在 IE8 中呈现的屏幕抓图 http://twitpic.com/1vtwrd

它在我尝试过的所有其他浏览器中都可以正常工作，包括 IE7，所以我有点迷茫，有没有人知道任何技巧可以阻止这种情况发生？

4

1 回答 1

2

我发现你是否添加了一个高度的分页 div，例如。Map div前面有10px的空html内容，就可以解决问题了。

在 CSS 中：

page_break_before { 高度：10px; 分页前：总是；}

然后在 Map div 前面：

var pageBreakDiv = window.document.createElement('div'); pageBreakDiv.id = 'page_break_before'; printMapDiv.appendChild(pageBreakDiv);

并删除 page-break-before:always; 在你的#map div 中。

干杯，

静

于 2010-07-16T11:36:03.583 回答