随笔分类 - H5
摘要：调试微信，app中H5网页大概有如下几个方法： （1）、我们可以直接把网页的url放在chrome浏览器中进行调试。（不涉及微信登录） （2）、我们可以把网页的url放在微信开发者工具中进行调试。（不涉及微信登录，如有，则需要在服务号里面进行授权设置，也就是只能调试自己的H5网页） （3）、我们可以
阅读全文
摘要：我们在H5中对于图片的属性包含如下： object-fit属性有哪些值呢？ object-fit: fill; object-fit: contain; object-fit: cover; object-fit: none; object-fit: scale-down; fill: 中文释义“填
阅读全文
摘要：H5的上传图片如何实现呢？ 以下是我用vue实现的图片上传功能，仅供参考。 后台PHP只需要利用 获取到接收的文件即可实现上传。
阅读全文
摘要：引入jweinxin相关js文件，然后才可以做H5的分享 <script src="js/jweixin-1.2.0.js"></script>
阅读全文
摘要：小程序有此功能的跳转方法。 那么H5如何实现该功能？ 很简单。 location.replace('new.html') 这个方法可以实现 关闭当前页面，跳转到新页面 的效果。 而 window.location.href = “new.html”， 这个方法会保留历史的访问记录。
阅读全文
摘要：1、如何判定H5中滑动到底部，然后加载更多的功能实现。 思路：我们需要设定一个固定高度的盒子，然后我们利用scroll来监听滚动，当scrollTop（滚动的距离） + clientHeight（页面的设定的高度） >= scrollHeight（页面内容总高度） 这样我们就可以判定页面内容滑动到底
阅读全文
摘要：前言： css应用中，我们常会碰到background-size的用法，不妨下面总结一下，以便后续查看。 一、先弄个简单的box框。 二、看效果： 情况1：background-size: 100% 100%; 看的出来，图片长宽都显示出来了，但是图片变形了。 情况2：background-size
阅读全文
摘要：前言； 做移动端的同学都知道，移动端的尺寸参差不齐，那么如何才能实现各移动端情况下，都能很好地自适应尺寸大小呢？ 那就是rem这个单位！我们可以利用js来控制1rem在不同的移动端尺寸情况下对应不同的px（px是绝对单位）。 实现方式: 有兴趣的可以搜淘宝的flexible.js前端自适应解决实现方
阅读全文
摘要：前言： 在项目中，我们常会用到页面切换，如果我们把上一个页面display:none;然后让下一个display:block;这样难免会显得比较生硬，那么如何实现缓缓切换到下一个页面的效果呢？ 实现方法： 1、首先给盒子加过度属性。 2、然后待切换的时候，再添加一个类，属性如下： 这样既可实现缓慢切
阅读全文
摘要：pointer-events: none； 可以让某个元素实现类似于海市蜃楼的效果，具体理解为，你可以看的到某个元素，但是你无法摸的着。 而display：none; 是你摸不着，但是你也看不见。 pointer-events: none；摸不着，但是看得见。如果把某个元素再加上opacity：0；
阅读全文
摘要：1、前言： 在项目中，我们常会遇见在手机端需要横屏观看的效果，而在pc端则默认切换到竖屏的样式。 或者是，UI提供的图是一个长图，但是在移动端我们需要让这个图在手机横屏时显示。 以上两个都需要我们实行一个框的自行切换方向，这个该如何实现呢？ 2、解决方案 我们把所有需要切换方向的内容，都放在一个盒子
阅读全文
摘要：前言： 有时候做项目过程中，设计的是一张横向的长图，但是我们需要在手机端观看的时候，也想把手机横着观看，这样视野更宽阔，如何解决这个问题呢？ html css 说明： 1、imgBox设置成横向长图的大小，然后把长图设置成背景图片，这里尤其注意 background-size: auto 100%;
阅读全文
摘要：1、把小程序wxml里面的如下标签对应改成H5的标签，即可快速转化成H5的页面！ 利用ctrl+H将下面的对应标签全部替换！ html: <view <div </view> == </div> <image <img </image> ‘’<text == <span <text> == <spa
阅读全文
摘要：引言： 我们经常在做微信H5的过程中需要自定义分享网页，这个如何实现呢？请看如下的封装的ES6类及使用说明！
阅读全文
摘要：前言： 我们在做项目过程中，经常会遇到自定义生成一张图片并可以长按保存。长按保存图片在微信等浏览器中默认就有，那么对于生成图片的有哪些方式呢？ 方法一： 利用canvas绘制图形，然后生成图片 代码如下： var imgsrc = c.toDataURL("image/jpeg",1); 小结：这种
阅读全文
摘要：1、第一个是关于移动端自适应的问题： 答：如果是最后只要一张canvas生成的图片，而不是要绘制的canvas的图形，则不需要考虑自适应，绘制canvas的时候的宽高，可以直接写成UI提供的图的大小，比如UI提供的图是 750 * 1280 ,则绘制canvas的时候，所有的数据都可以 以375*6
阅读全文
摘要：说明：引入改类后，调用init方法，然后在回调函数里面判断返回的数字， 进而来判断用户滑动的方向！ 同时，如果第二个参数返回的是true，代表的是向某个滑动方向滑动进行时，即touchmove!
阅读全文
摘要：一、session与cookie的区别 二、HTML5中WebStorage理解 WebStorage的目的是克服由cookie所带来的一些限制，当数据需要被严格控制在客户端时，不需要持续的将数据发回服务器。 WebStorage两个主要目标：（1）提供一种在cookie之外存储会话数据的路径。（2
阅读全文