JavaScript
企业网站如何自定义高德地图?HTML + 高德 Key 完整教程
现在很多企业网站都会在“联系我们”页面放置地图,用于展示公司位置、导航路线等信息。相比第三方嵌入地图,自定义高德地图的方式更加灵活,可以自由控制样式、缩放、信息窗口、交互逻辑等。本文以我自己客户网站的地图页面为例,分享一个基于 HTML + JavaScript 的高德地图自定义方案,支持:自定义地图坐标自定义 Marker 标记默认展开信息窗口禁用鼠标滚轮误触缩放按住 Ctrl / Shift 后启用地图缩放iframe 嵌入网站页面适用于企业官网、WordPress、帝国CMS 等网站最终效果预览用户打开页面后:地图自动定位到指定坐标默认显示公司名称与地址点击标记可重新打开信息窗口鼠标滚轮默认无法缩放地图按住 Ctrl 或 Shift 后才能缩放这种方式特别适合企业官网,可以有效避免用户在浏览页面时误缩放地图导致页面滚动异常。一、申请高德地图 Key首先需要去高德开放平台申请 Web 端 Key。高德开放平台:高德开放平台注册账号后:创建应用选择 Web 端(JS API)创建 Key获取你的 API Key然后将代码中的:key=你的KEY替换成你自己的 Key 即可。二、完整 HTML 地图代码下面是完整示例: 自定义高德地图
查看更多网站禁止页面被复制和禁止右键,一段样式一段JS就行了,无需复杂设定! 朋友有时候会问夏曲怎么禁止页面复制和右键,其实这个问题百度一下是很多资料的,我估计小伙伴都懒,所以这里统一回复下: 找到模板里面的,在上面加如下代码就行了
查看更多JS部分: CSS部分.fixednav { position: fixed !important; top: 0px; left: 0px; width: 100%; z-index: 1; }
查看更多