iH5初级教程:掌握用H5做百度地图导航

iH5初级教程:掌握用H5做百度地图导航

在做邀请函或活动通知H5作品的时候,最后可以告诉别人活动地址在哪里。点击页面上一键导航的按钮可以链接到百度地图。点击电话预约,会跳转到拨打电话的页面。

获取百度地图链接

1、打开百度地图,输入目标地点,例如广州图书馆。

2、在小窗口上点击右上角三角形,再点分享

3、复制地址

4.如果在手机端打开作品,避免提示下载百度地图APP,影响用户体验,可以使用第二种方法。在浏览器打开网址:直接输入百度地图的网址。输入目标地点,广州天河汽车客运站。

点击右上角地图,显示地图后,请务必点击刷新,然后复制其地址。

1、在对象树选中舞台,点击工具栏透明按钮工具,并为透明按钮选择一个背景颜色,透明按钮下添加提示一键导航的文本。

2、选中透明按钮,点击工具栏事件工具,添加事件,点击透明按钮,目标对象舞台,目标动作打开网页,资源位置填写百度地址

3.选中一键导航文本,点击工具栏事件工具,添加事件,点击文本,目标对象舞台,目标动作打开网页,资源位置填写百度地址。

文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发打开百度导航的事件。

电话预约的透明按钮下添加事件,点击透明按钮,目标对象舞台,目标动作拨打电话,输入一个电话号码。同理,目标动作选择发送短信,输入一个电话号码,点击按钮后手机就会跳至发送短信的界面。

文本下的事件,点击文本,目标对象舞台,目标动作拨打电话。

文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发拨打电话的事件。

重点控件:透明按钮、文本、事件

重点事件:

1、打开网页:选中打开网页的文本,添加事件,触发条件点击,目标对象舞台,目标动作打开网页,输入一个网址。

2、拨打电话:选中拨打电话的文本,添加事件,触发条件点击,目标对象舞台,目标动作拨打电话,输入一个电话号码。

3、发送短信:选中发送短信的文本,添加事件,触发条件点击,目标对象舞台,目标动作发送短信,输入一个电话号码。

知识点:

1、打开百度地图,输入目标地点,点击目标地点小窗口上右上角三角形,再点分享,获得一个地址。

2、在手机端打开作品,避免影响用户体验。在浏览器打开百度地图网址。输入目标地点,点击右上角地图,点击刷新,然后复制其地址。

3、透明按钮和文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发事件。