Google maps 打开时打印Fancybox的内容，关闭时打印页面的内容_Google Maps_Printing_Fancybox

Google maps 打开时打印Fancybox的内容，关闭时打印页面的内容

google-maps printing

Google maps 打开时打印Fancybox的内容，关闭时打印页面的内容,google-maps,printing,fancybox,Google Maps,Printing,Fancybox,我试图让用户能够在Fancybox打开时打印Fancybox的内容。Fancybox的内容是Google Maps directionsPanel，它位于自己的div中。基本上，我想让用户能够打印他们刚刚搜索完的方向但是，当Fancybox未打开时（即当他们查看包含地图的页面内容时）。我希望用户能够打印页面我曾尝试使用CSS创建“可打印”和“不可打印”的代码段，但这显然违背了我的目的这是我目前的代码： <style type="text/css"> -->

我试图让用户能够在Fancybox打开时打印Fancybox的内容。Fancybox的内容是Google Maps directionsPanel，它位于自己的div中。基本上，我想让用户能够打印他们刚刚搜索完的方向

但是，当Fancybox未打开时（即当他们查看包含地图的页面内容时）。我希望用户能够打印页面

我曾尝试使用CSS创建“可打印”和“不可打印”的代码段，但这显然违背了我的目的

这是我目前的代码：

   <style type="text/css">

    -->#printable { display: none; }

    @media print
    {
        -->#non-printable { display: none; }
        -->#printable { display: block; }
        body * { visibility: hidden; }
        #directionsPanel * { visibility: visible; }
        #directionsPanel { position: absolute; top: 1px; left: 1px; }

    }
    </style>



  </head>
  <body onLoad="initialize()">
    <table>
        <tr>
            <td>
                <input name="start_address" id="address" type="text" value="Enter Address" onFocus="doClear(this)" size="45"/>
            </td>
        </tr>
        <tr align="center">
            <td align="center">
                <a id="portDirectionBtn" class="fancybox" href="#directionsPanel" onClick="calcRoute();">Get Directions</a>
            </td>
        </tr>
    <div id="map_canvas" style="width:300px; height:300px">
    </div>
    <div id="printable">
    <div id="directionsPanel">
        <a href="javascript:window.print();">Print!</a><br />
    </div>
    </div>
    </table>

  </body>
</html>


-->#可打印{显示：无；}
@媒体印刷品
{
-->#不可打印{显示：无；}
-->#可打印{显示：块；}
正文*{可见性：隐藏；}
#directionsPanel*{可见性：可见；}
#方向面板{位置：绝对；顶部：1px；左侧：1px；}
}

当然还有Fancybox和Google地图脚本。如果那个代码有帮助，请告诉我。感谢您的帮助

在iframe中打开fancybox并从内部调用打印。因为它位于iframe内部，所以print命令只会看到它，因此会打印它。如果fancybox关闭，您可以从另一个按钮（iframe外部）调用print来打印整个页面

您检查过了吗？