上一篇: css – Chrome和Safari浏览器中的... 下一篇:css – 具有两种颜色的文本

css – google地图在jquery手机

CSS 发布时间：2022-04-17 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了css – google地图在jquery手机，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

当在 jquery手机中显示谷歌地图时,会出现(阅读论坛后)需要以下代码：

<div data-role="page" data-theme="b" class="page-map" style="width:100%; height:100%;">
    <div data-role="header"><h1>Map Page</h1></div>
    <div data-role="content" style="width:100%; height:100%; padding:0;"> 
        <div id="map_canvas" style="width:100%; height:100%;"></div>
    </div>
</div>

取走外部div的高度会使div下降到高度0,并且地图不显示.我希望在地图下方获取一些动态文本(根据内容)我不知道的长度,所以我无法设置绝对高度.有没有人有这个问题的解决方法？

解决方法@H_450_8@

这不是Google地图相关的问题,事情是,您需要为您的Map画布设置一个特定的宽度和高度,您的代码可以重写为：

<div data-role="page" data-theme="b" class="page-map" style="width:100%; height:100%;">
    <div data-role="header"><h1>Map Page</h1></div>
    <div data-role="content" style="padding:0;">
        <div id="map_canvas" style="width:300px; height:300px;"></div>
      <p id="text">Lorem ipsum legere facilisi conclusionemque pro et,sint aperiam vel at. No postea scaevola vivendum duo,et vix erant paulo. Ex fuisset perfecto vix. No sit laudem noster scriptorem,probatus assueverit ius cu.</p>
    </div>
</div>

Example link

更新：看看@Blowsie评论,你也可以检查jquery-ui-map插件.