//一般在PC上我们要分页都是通过上一页和下一页来实现的,手机通过当下滑到一定程度的时候自动加载下一页面//实现思路:首先加载部分数据,当下滑到某个元素可见的时候,如果还有数据,则新发送请求,然后追加在当前页面 一.PC端 /* *<div class='topicBox' id='listBox'> *</div> */ //判断元素是否进入可视区域 function see(objLiLast) { //浏览器可视区域的高度 var see = document.documen…

写在前面 最近在负责一个微信小程序的前端以及前后端接口的对接的项目,整体上所有页面的布局我都已经搭建完成,里面有一些常用的特效,总结一下,希望对大家和我都能有所帮助 实例1:滚动tab选项卡 先看一下效果图吧,能够实现点击切换,tab菜单部分可以实现左右滚动 好了,看一下我的源码吧!<喜欢的话拿走不谢哟> 1.wxml <!-- tab header --> <scroll-view scroll-x="true" class="tab-h&qu…

写在前面 最近在负责一个微信小程序的前端以及前后端接口的对接的项目,整体上所有页面的布局我都已经搭建完成,里面有一些常用的特效,总结一下,希望对大家和我都能有所帮助 实例1:滚动tab选项卡 先看一下效果图吧,能够点击菜单或滑动页面切换,tab菜单部分可以实现左右滚动 好了,看一下我的源码吧!<喜欢的话拿走不谢哟> 1.wxml <!-- tab header --> <scroll-view scroll-x="true" class="tab…

侧边栏滑动是很常见的功能,但是小程序出来不久,很多特效还没有成熟案例,只能原生重写,所以今天为大家带来4个漂亮的侧边栏特效~~ 侧边栏特效一 先看效果: wxml: <!--page/one/index.wxml--> <view class="page"> <view class="page-bottom"> <view class="page-content"> <view class=&…

简介 看到今日头条小程序页面可以滑动切换,而且tab导航条也会跟着滚动,点击tab导航,页面滑动,切导航栏也会跟着滚动,就想着要怎么实现这个功能 像商城类商品类目如果做成左右滑动切换类目用户体验应该会好很多,我这里只是一个小demo,没有怎么去考虑数据的问题,主要是想着去实现这么个功能,有可能后期引入数据后会出现问题,欢迎提出互相讨论 解决过程 1.在想要实现这个问题的时候找了不少别人的博客看,主体页面布局方面是比较统一的,tab导航栏使用<scroll-view>标签,内容使用<swi…

最近在做一个导航的时候,发现使用overflow-x: auto来做多内容滑动导航效果很不好,思索是不是可以使用swiper来做一个,研究了下其实发现原理基本相同 这里说下,要用swiper做导航菜单,有几个要特别注意的参数 1:autoplay,官方说明[是否自动切换],这个不填,菜单可不能自己动 2:indicator-dots ,官方说明[是否显示面板指示点],这个也不填, 3:display-multiple-items,官方说明[同时显示的滑块数量],敲重点,这个参数必须设为1,要与p…

最近做一个项目,由于用到了竖向swiper,导致占用屏幕过大,用户滑动总是滑动到swiper组件,页面无法向下拉动,于是找各种办法禁止用户手动滑动swiper组件. 经过网上一番查找,网友们也是闹洞大开,各种方法都想出来了,有用透明蒙层覆盖的,这不失为一种很好的解决办法,但是如果swiper上有元素需要点击就没有办法了. 继续查找,于是找到了用  catchtouchmove  事件来截获用户手动滑动事件,这样既解决了禁用用户手动滑动,有解决了有点击按钮不影响使用 贴代码: WXML: <swi…

前言 一直想给项目中的小程序设置侧滑栏,将退出按钮放到侧滑中,但是小程序没有提供相应的控件和API,因此只能自己手动实现,网上很多大神造的轮子很不错,本文就在是站在巨人的肩膀上实现. 效果 先看看效果,我的侧滑栏需要列出如下信息: 初始状态下,左下角设置悬空按钮 点击悬空按钮,侧边栏拉出,悬空按钮旋转180度 主页内容向右滑动一定比例,并设置阴影遮罩 实现 首先将xml文件分为三部分,一部分是主页内容,一部分是侧滑栏内容,一部分是悬浮按钮. <!--index.wxml--> <view…

写在前面 之前写了一篇<微信小程序实现各种特效实例>,上次的小程序的项目我负责大部分前端后台接口的对接,然后学长帮我改了一些问题.总的来说,收获了不少吧! 现在项目已经完成,还是要陆陆续续总结一下的,总结的过程也是对知识梳理和清晰的过程! 这次主要聊一下小程序前后端接口对接的一些事, 对于客户端与服务端接口的对接,微信小程序提供了wx.request()的API接口,完美的实现前端后台的对接: 一个简单的栗子: wx.request({ url: API_URL + '/api/categor…

原文链接:https://mp.weixin.qq.com/s/7CM18izpZqf0oc0D75IGmQ 1 概述 在手机应用的开发中侧边栏滑动是很常见的功能,当然在小程序中也不会例外,很多特效还没有成熟案例,只能原生重写,所以今天在网上为大家收集整理来几个非常漂亮的侧边栏特效.今天我们就分享这样的小教程.希望对大家有所帮助. 快去拿个小板凳,坐等更多更新 注意:如若需要请联系微信geekxz 2 wxml                                          …