1.wxml
<scroll-view class="scroll-view_H" scroll-x style="width: 100%" scroll-into-view="{{toView}}" scroll-left="{{scrollTop}}" bindscrolltoupper="upper" bindscrolltolower="lower" bindtouchstart="onTouchstartArticles" bindtouchend="onTouchendArticles" > <view id="green" class="scroll-view-item_H bc_green"></view> <view id="red" class="scroll-view-item_H bc_red"></view> <view id="yellow" class="scroll-view-item_H bc_yellow"></view> <view id="blue" class="scroll-view-item_H bc_blue"></view> </scroll-view>
2.js
Page({ /** * 页面的初始数据 */ data: { toView:"green", scrollTop:0, startTouchs: { x: 0, y: 0 } }, upper:function(e){ console.log(e), console.log("在深圳只有不断的向前跑才能看见自己的出路") }, lower:function(e){ console.log(e), console.log("你不努力谁替你坚强") }, scroll:function(e){ console.log(e), console.log("可是回家又能做些什么呢") }, tap:function(e) { for(var i = 0 ; i < order.length; i++){ if(order[i] === this.data.toView){ this.setData({ toView:order[i + 1] }) break } } }, tapMove: function (e) { this.setData({ scrollTop: this.data.scrollTop + 10 }) },