2016年11月_马优晨

12月 11月 10月 09月 04月

原创小程序轮播

其实官网已经有了相关说明，但是这个也是通过一个实例来说明一下，小程序的轮播效果：先看一下效果图： JS代码：var app = getApp();Page({ data: { imgUrls: [ 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',

2016-11-25 15:37:32 3014

原创小程序调用接口实例

在这里通过一个简单的实例来说明微信小程序接口调用：首先看一下效果：这个就是小程序的真实样貌，体验度和原生APP还是有点相似的。JSON数据配置：{ "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", "navigationBarTitleText": "萌店商品详情",

2016-11-25 14:24:51 50145 3

原创在小程序中将多个view居中显示

我们在这里要实现的效果是这样的，在小程序中将多个view居中显示先看一下效果图如下图效果所示：我们需要将 “延长收货”，”查看物流”，“提醒发货”，“提醒发货”是四个按钮放在页面最中间，并且间隔适当的距离：HTML代码： <view class="footer"> <view class="footer-btn" style="display:flex;flex-dir

2016-11-25 14:05:17 28924 2

原创将SVG 图引入到HTML页面

将SVG图引入到HTML网页，目前只有三种办法，前两种很相似，第三种更简单。下来介绍一下这是那种方法。第一种：使用<embed>标签：这个是官方推荐的用法，但是这个官方是Adobe官方，不是W3C官方，现在的HTML标准里还没有这个标签。<embed src="example.svg" width="300" height="300" type="image/svg+xml" pluginspa

2016-11-04 15:36:05 54330 3

原创 H5禁止弹窗页面滚动

这篇文章讲解一下，弹窗弹出以后，如何禁止页面滑动的技巧。如下图所示，在“弹窗”弹出后页面是可以滚动的。解决方案：第一步：在点击弹框的事件中添加： $("body").addClass('prevetwinow');第二步：在关闭弹框的事件中添加： $("body").removeClass('prevetwinow');第三步：写CSS中prevetwinow的内容.prevetwinow{

2016-11-03 14:44:48 4232 1

原创弹框在一个很的长页面居中显示

说到这个问题，100%的前端工程师都遇到过。但是这个问题又是不太好形容，所以对此做解释的人自然很少，这里，我要对这个问题，做一下解释，以一个实际的例子引出话题，分析问题。下面先看下，在各种机型上支持的效果。Nexus 5X iphone6Galaxy note3 Ipad iphone6 plus 接下来就是代码部分了：HTML<div class="arrow_mask"

2016-11-03 11:41:45 2897

原创 canvas的简单实例集合

这里讲解一些canvas的实例demo，大家可以参考着看看，希望对你有一定的帮助。这里的demo主要是：canvas 绘制路径、绘制矩形、绘制文本、绘制圆形和扇形、设置渐变色、设置渐变色、图像处理方法、动画HTML代码<canvas id="myCanvas" width="400" height="200"> 您的浏览器不支持canvas！ </canva

2016-11-02 22:07:37 4150

原创用canvas绘制一个圆形，实现绕着一个中心运动

实现效果使用canvas绘制一个圆形，实现绕着一个中心，轨迹类似于走一个椭圆的轨迹那样路线，并且实现漂浮的效果。这里只是一个实例Demo，直接运行就可以，下面附上代码：<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content

2016-11-02 21:37:11 5570