2017年7月

demo地址

幻灯片

  • 使用微信小程序原生组件swiper实现。
    <swiper 
        indicator-dots="{{indicatorDots}}" 
        autoplay="{{autoplay}}" 
        interval="{{interval}}" 
        duration="{{duration}}">
        <block wx:for="{{imgUrls}}" wx:key="index">
            <swiper-item>
                <image src="{{item}}" class="slide-image" 
                mode="scaleToFill"/>
            </swiper-item>
        </block>
    </swiper>

配合在逻辑页面配置数据实现幻灯片

- 阅读剩余部分 -

简单的数值过滤器

function f(s, e) {
    var ret = [];
    for (var i in s) {
        ret.push(e(s[i]));
    }
    return ret;
}

Dome

var a = [-1, -1, 1, -3, -3, -3, 2, 2, -2, -2, 3, -1, -1];
var b = f(a, function(n) {
    return n > -0 ? n : 0;
});
console.log(b);

结果

[0, 0, 1, 0, 0, 0, 2, 2, 0, 0, 3, 0, 0]

-webkit-overflow-scrolling


概述

-webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果.

在样式表对应的class里添加属性

值:auto

-webkit-overflow-scrolling: auto;
使用普通滚动, 当手指从触摸屏上移开,滚动会立即停止。

值:touch

-webkit-overflow-scrolling: touch;
使用具有回弹效果的滚动, 当手指从触摸屏上移开,内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。