iH5初级教程:掌握用H5做百度地图导航
在做邀请函或活动通知H5作品的时候,最后可以告诉别人活动地址在哪里。点击页面上一键导航的按钮可以链接到百度地图。点击电话预约,会跳转到的页面。
第一步:获取百度地图链接
1、打开百度地图,输入目标地点,例如广州图书馆。
汽车网址导航2、在小窗口上点击右上角三角形,再点分享。
3、复制地址
2、如果在手机端打开作品,避免提示下载百度地图APP,影响用户体验,可以使用第二种方法。在浏览器打开百度地图的网址,输入目标地点,广州天河汽车客运站。
点击右上角地图,显示地图后,请务必点击刷新,然后复制其地址。
第二步:
1、在对象树选中舞台,点击工具栏透明按钮工具,并为透明按钮选择一个背景颜,透明按钮下添加提示一键导航的文本。
2、选中透明按钮,点击工具栏事件工具,添加事件,点击透明按钮,目标对象舞台,目标动作打开网页,资源位置填写百度地址。
选中一键导航文本,点击工具栏事件工具,添加事件,点击文本,目标对象舞台,目标动作打开网页,资源位置填写百度地址。
文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发打开百度导航的事件。
第三步:电话预约的透明按钮下添加事件,点击透明按钮,目标对象舞台,目标动作,输入一个电话号码。同理,目标动作选择,输入一个电话号码,点击按钮后手机就会跳至的界面。
文本下的事件,点击文本,目标对象舞台,目标动作。
文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发的事件。
重点控件:透明按钮、文本、事件
重点事件:
1、打开网页:选中打开网页的文本,添加事件,触发条件点击,目标对象舞台,
目标动作打开网页,输入一个网址。
2、:选中的文本,添加事件,触发条件点击,目标对象舞台,目标
动作,输入一个电话号码。
3、:选中的文本,添加事件,触发条件点击,目标对象舞台,目
标动作,输入一个电话号码。
知识点:
1、打开百度地图,输入目标地点,点击目标地点小窗口上右上角三角形,再点分
享,获得一个地址。
2、在手机端打开作品,避免影响用户体验。在浏览器打开百度地图的网址。输入
目标地点,点击右上角地图,点击刷新,然后复制其地址。
3、透明按钮和文本下添加事件是因为,文本是透明按钮的子对象,有可能覆盖透
明按钮,添加两个事件是为了点击透明按钮位置时,一定可以触发事件。