muzimiaomiaopeng的博客

一直成长的猿,欢迎吐槽交流

display:inline-block的一点问题

如图:div. sqlContent和它的两个兄弟元素都是利用display:inline-block调整到一行显示,但是每个元素在设置的宽度之外还占据了一点空间,导致一些小问题。 解决办法:父级容器设置letter-spacing:-0.5em,然后子元素将letter-spacing设置为0...

2019-04-10 17:42:26

阅读数 21

评论数 0

html加css制作一个滑动开关

这样的一个开关还是比较常用的,实现的方法也挺多,记录html+css实现的一种 html: <div class="switch-btn"> <input type="checkbox" class=&quo...

2019-04-10 17:31:11

阅读数 19

评论数 0

利用canvas完成移动端裁剪图片功能以及在用drawimage绘制图片的一点问题

最近项目有了一个裁取图片的一部分的需求,效果图如下: 实现思路比较简单,点击上传图片的时候,触发input;input的onchangge事件触发的时候,利用fileReader读取图片信息并显示第二张图的界面;点击完成时,将截取框距离图片顶部的距离保存到图片的文件名里面,上传整张图...

2019-03-08 14:34:57

阅读数 13

评论数 0

前端开发----图片自适应

最近完成了一个关于图片自适应显示的需求,就是比屏幕小的显示原尺寸,比屏幕大的图片不超出屏幕显示。 刚看到这条需求,第一反应,js来控制。 于是便写下这么一段(以宽度为例): var img = $(.img); img.load(function(){ var imgW = img...

2018-09-19 16:43:07

阅读数 302

评论数 0

微信小程序——获取位置(二),百度地图、高德地图篇

在获取位置信息的时候,除了腾讯地图,我们还可以选择更多别的地图,比如百度、高德等。和使用腾讯地图一样,使用这两家地图也需要经过注册账号、申请开发秘钥、下载SDK者三个步骤,具体操作和腾讯地图篇大同小异,不做过多介绍,只提供官网链接: 百度地图开发者平台:http://lbsyun.baidu.c...

2018-08-29 14:25:58

阅读数 1709

评论数 2

微信小程序——获取地址信息(一),腾讯地图篇

小程序对获取用户地址信息的需求是很常见的,小程序官方也给出了一些关于获取位置的api,但是只支持获取经纬度,大多数时候我们需要获取到用户的具体地址,而不是一堆数字。实现这个功能就需要借助外部力量了。 目前国内主流的腾讯地图、百度地图、高德地图都提供了支持小程序开发的JavaScript SDK,...

2018-08-29 14:06:48

阅读数 3710

评论数 0

微信小程序——关于wx.makePhoneCall的巨坑

小程序总会有下图这样的一个需求: 点击它,会这样显示: 关于联系客服,微信提供了wx.makePhoneCall这个api。一开始用的时候,我以为它不会自动弹出窗口,于是我写了这样一段代码: wx.showActionSheet({ itemList: ['400-...

2018-08-24 17:41:13

阅读数 2735

评论数 0

小程序开发——wx:for循环添加的元素怎么设置不同的样式

在编写一个页面的时候,总会遇到一组出了文字内容其它都相同的组件,这时候如果使用循环是非常方便的,微信小程序也有自己的解决方案。 我们可以通过使用wx:for='{{items}}'进行组件的重复渲染,在js文件中设置items的值就可以实现。但是,在动态地设置每一项的样式的时候,出问题了。 我...

2018-08-21 09:47:59

阅读数 1598

评论数 0

小程序button以及滚动条默认样式的清除

实现如下图所示的效果,用四个button实现:         在编写样式的时候,总是清除不了button的圆角和边框,神魔恋!         其实,我们可以查看button的默认样式来解决它;我们创建一个button,查看style,我们发现了问题        原来小程序的butt...

2018-08-21 09:11:31

阅读数 567

评论数 0

提示
确定要删除当前文章?
取消 删除
关闭
关闭