html
关注
分享
扫一扫
Zhencode
人生没有成败，凡事正面思考
展开
-
h5实现地图定位签到
本文示例基于腾讯地图所实现的一个在日常业务开发中偶尔会用到的功能：地图中上实现定位签到使用地图的签到功能，能实现在业务中的一些功能比如有：考勤签到，活动办理打卡点定位，判断某个目标是否在当前设置的范围内从而实现一些业务要求。现在有很多方式可以实现该功能，不管是app,小程序或者是h5端，前提都是首先基于第三方的地图提供的定位做实现，先上一张大概的效果图如下：从图中可以看到，位置点标记的为当前用户所处的位置，也就是用户当前所在的真实定位位置，在图中还标记着签到点，签到点为用户所标记需要签到的地点，该标原创 2022-06-25 19:25:41 · 2587 阅读 · 2 评论 -
vue实现h5文件上传功能组件
该组件为自定义上传文件的功能，使用函数调用实现上传，功能比较简单，后续仍待完善原创 2022-06-06 11:42:06 · 688 阅读 · 0 评论 -
web端使用腾讯地图
前端中使用第三方地图是比较常见的，现在国内提供接入的地图主要有腾讯，高德，百度等第三方。而腾讯地图则是用的比较多的，在移动端，web端，公众号或者小程序的支持度也比较高，提供的功能比较丰富也是大多数业务中需要用到的。本文实现的主要有以下几个功能根据当前ip定位自定义搜索查找位置，根据地图返回的位置数据选择定位可在地图上点击标记进行定位输入框搜索选择获取位置信息点击地图实现标记并获取位置信息根据现有ip定位腾讯地图申请使用需要申请应用的key后才能调用相关的api由于篇幅有限原创 2022-01-18 14:56:25 · 1976 阅读 · 1 评论 -
移动端实现1px像素边框
<div class="box"></div> .box{ width: 100px; height: 100px; position: relative; } .box::after{ position: absolute; left: -50%; top: -50%; wi..原创 2021-07-19 10:58:46 · 194 阅读 · 0 评论 -
浏览器滚动条自定义
/*整个滚动条*/ ::-webkit-scrollbar { width: 6px; height: 6px; background-color: #ffffff; } /*滑动轨迹*/ ::-webkit-scrollbar-track { background-color: transparent; } /...原创 2021-07-19 10:46:17 · 98 阅读 · 0 评论 -
h5创建相同标签内容数字递增快捷键
$符代表数字，*6表示创建6次，默认从1开始，间隔1{$}*6123456{$ }*4 /*$后边加space*/1 2 3 4 {$,}*4 /*$后边加逗号*/1,2,3,4,# 从固定编号开始，@6表示从6开始编号{$@6,}*46,7,8,9原创 2020-07-05 17:07:46 · 2622 阅读 · 0 评论 -
video自定义实现视频播放功能
import React, {Component} from 'react'import style from '../style/Video.module.css'import play from '../../../assets/player/play.png';import pause from '../../../assets/player/pause.png';class Vi...原创 2020-01-20 10:24:42 · 470 阅读 · 0 评论 -
倒计时
定义获取时间函数数组function getHoursMinutesSecondsByMS(time){ if(typeof time!='number' && time<0){ return null } var hours=parseInt(time/(1000*60*60))%24 // console.log(hours) var minutes=pa...原创 2019-11-18 10:57:17 · 174 阅读 · 0 评论 -
html模板
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Com...原创 2019-11-16 21:12:23 · 690 阅读 · 0 评论 -
京东商城首页实现
本页面采用html+css+jquery设计实现代码github地址链接: https://github.com/Zhen-code/jingdong_web.git.原创 2019-10-04 01:19:29 · 759 阅读 · 1 评论