php小程序 100行左右,微信小程序 左右分类滚动列表
今天需求个类似得到app分类的功能,效果如图:
左右分别滚动,互不干扰,先把简单的布局和样式搭好。
左侧分类
右侧顶部分类
右侧列表
.flex_row{display: flex;flex-direction: row;}
.nav_left{width: 25%;height:100vh;overflow-y:auto; }
.nav_right{width: 75%;position: relative;}
.nav_right .nav_right_top{padding-top:20rpx;position: fixed;top:;right:;width: 75%;height:80rpx;font-size:30rpx;
border-bottom: 1px solid #dedede;display:flex;flex-direction:row;white-space: nowrap;background: #fff;z-index:}
.nav_right_list{margin-top:80rpx;height:calc(100vh - 80rpx);}
简单的效果已经出来了,往里面填充数据就好了。。
微信小程序编写新闻阅读列表
微信小程序编写新闻阅读列表 不忘初心,方得始终:初心易得,始终难守. 本篇学习主要内容 Swiper 组件(轮播图) App.json 里的关于导航栏.标题的配置. Page 页面与应用程序的生命周期 ...
解决微信小程序ios端滚动卡顿的问题
方案1:直接使用微信小程序提供的 “scroll-view " 组件.
微信小程序实现给循环列表点击添加类(单项和多项)
在微信小程序里面没有DOM对象, 不能操作DOM. 所有的操作通过数据来实现,下面主要实现了给循环列表点击添加类的操作 一.单项 目标需求:实现下图,给点击的view增加类,每次只能选择一个. 主要思 ...
微信小程序实现给循环列表添加点击样式实例
微信小程序有个属性hover-class='active',是指当点击列表元素时当按下鼠标左键会显示active样式,但是鼠标离开样式就会复原.可以参考以下解决方案,直接上代码: wxml: ? 1 ...
[微信小程序] 微信小程序下拉滚动选择器picker绑定数据的两种方式
小程序 picker 多列选择器 数据动态获取 需求是将各校区对应各班级的数据 以两列选择器的方式展示出来,并且可以在选择完成之后记录选结果参数. 校区数据 和 班级数据 分别是两个接口,以 校区 t ...
微信小程序之点击列表的item带参数跳转界面
1.在js文件里写个界面跳转的事件处理函数gotableinfo,var index = parseInt(e.currentTarget.dataset.index); 为获取当前点击列表的下脚标, ...
微信小程序 左右分类列表
分类界面,左边是一级目录,右边是一级目录对应的二级目录,根据这个需求,我们数据设计的结构一定是数组嵌套数组,第一个数组包含一级目录数据,嵌套的数组包含的是二级目录的数据. wxml代码:
微信小程序scroll-view横向滚动
官方文档给的代码复制下来发现无法滚动,没反应,使用css设置浮动属性也无效 官方没有给出css代码,横向需要设置两个css属性才行: white-space: nowrap; ----规定段落中的文本 ...
微信小程序分页加载列表
1.假设加载的数据为 2.wxml
随机推荐
在 Linux 上使用 Jexus + Mono 建立 Asp.Net 网站.
godaddy 买了个net空间,一点也不好用. 几个G的数据, 上传数据只有几kb , 想用 ssh 登录上去用 wget 下载,也不行 windows的主机貌似没有 ssh 功能... 后来实在忍 ...
iframe高度自适应内容
JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹.对于用户体验和网站美观起着重要作用. 如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高 ...
phonegap_android配置文档
百度文库 http://wenku.baidu.com/link?url=C9l51orfpSrjMEK69-Yjh9hmmaqQj0DicfnYs5FSRhkdy8S62x1aBBwstFH-tJ9 ...
多选出差同事id,拼接,去掉最后逗号
===========方法1 substr() ,永远都是.(第一个参数)开始位置.(第二个参数)截取个数 ,负数表示都后面开始数 substr($data['members'],0,strlen($ ...
修改linux的系统时间
可以使用date命令.date用于打印或设置系统日期和时间.设置系统时间需要root权限.用法示例:设置系统日期成2015年08月13日,这样会把具体时间设置清空成00:00:00$ sudo dat ...
pandas常用函数之diff
diff函数是用来将数据进行某种移动之后与原数据进行比较得出的差异数据,举个例子,现在有一个DataFrame类型的数据df,如下: index value1 A 0 B 1 C 2 D 3 如果执行 ...
linux子系统ubuntu16.04安装使用xrdp当远程桌面
参考文献:https://icytown.com/windows/windows-subsystem-for-linux-gui-xubuntu/ https://jingyan.baidu.com/ ...
有状态(Stateful)与无状态(Stateless)
1.有状态(Stateful): 有数据存储功能.有状态对象(Stateful Bean),就是有实例变量的对象,可以保存数据,类里面有成员变量,而且成员变量是可变的,是非线程安全的.在不同方法调用间 ...
【leetcode】121-Best Time to Buy and Sell Stock
problem 121. Best Time to Buy and Sell Stock code class Solution { public: int maxProfit(vector
php小程序 100行左右,微信小程序 左右分类滚动列表相关推荐
- python开发微信小程序-Python 开发者的微信小程序开发实践
导读 在知乎上,有人提问"如何使用 Python 开发微信小程序". 其实微信小程序作为一个前端的机制,Python 并不能插上边.只不过可以作为后端接口为微信小程序提供数据服务而 ...
- 微信小程序全选,微信小程序checkbox,微信小程序购物车
微信小程序,这里实现微信小程序checkbox,有需要此功能的朋友可以参考下. 摘要: 加减商品数量,汇总价格,全选与全不选 设计思路: 一.从网络上传入以下Json数据格式的数组 1.标题titl ...
- IT忍者神龟之小程序最全的微信小程序项目实例
想玩玩微信小程序的,可以下载个下面的一些demo看一看.(demo下载后,导入到"微信web开发者工具"便可以运行了,顺便把官方微信开发工具下载地址贴一下:下载 · 小程序)注:现 ...
- 小程序开发过程中常见问题[微信小程序、支付宝小程序]
小程序开发过程中常见问题[微信小程序.支付宝小程序] 正文 一.样式中如何使用background-image呢? background-image支持网络的图片链接或者base64 二.使用自适应单 ...
- 万能门店小程序_超市门店微信小程序注册流程
现在超市门店商家利用小程序卖货已经非常普遍,小程序可以便捷地连接线上线下通道,让商家不再局限于门店周围的流量,能够从微信获取更多客户,从而提升销量和店铺知名度.超市要想有自己的线上电商小程序,就得先注 ...
- 小程序助手多功能微信小程序反编译工具
介绍: 小程序助手多功能微信小程序反编译工具,软件采用 VS 2017 编译,需安装.net 4.0 或以上版本方可运行,理论上 win7 .win10及以上系统 x86 x64 运行正常,条件有限未 ...
- 微量小程序联盟,如何实现微信小程序换量和微信小程序推广?
长期以来各位许多小程序运营者,一直在为小程序如何推广和烦恼!今天我就为大家推荐一个小程序换量推广平台,可以快速帮我们解决小程序粉丝增长难的问题! 微量小程序联盟--专注小程序换量推广 微量小程序联盟- ...
- mpvue微信小程序动画_mpvue 与微信小程序的火花
介绍 项目介绍 WeScale 定位为音乐训练小程序,初期规划了基础音阶的三个训练,以及他们的镜像模式. 数字简谱 字母简谱 数字简谱对字母简谱 后期看情况更新追加其他训练. 产品展示 扫描下方小程序 ...
- 微信小程序开发语言(微信小程序开发教程)详细步骤
微信小程序开发语言 开发微信小程序用什么语言 1.微信小程序开发所需要的语言比较特别,首先介绍一下需要使用到的文件类型大致分为:WXML(WeiXin Mark Language 微信标记语言).WX ...
最新文章
- 从多个角度来理解协方差(covariance)
- LINQ学习之旅——准备(2)
- 树莓派GPIO的两种模式区别
- Linux下安装 Indy 到 Lazarus
- ORB-SLAM2 学习1
- php学习日志(3)-echoprint
- java ajax 更改头像_ajax+node实现头像更改
- django ajax 查询,Django分页和Ajax查询
- 前端从入门到精通(记录自己的前端学习之路)都是一些自己做的笔记
- Java-重复性代码统计第一篇
- 数字/模拟信号中带宽的含义
- 灵长类动物手臂的计算模型:从手部位置到关节角度、关节扭矩和肌肉力
- CCS6.0新建DSP_2833x工程文件详解
- meo学习笔记1:编译是什么——程序的执行过程概述
- 全景Engine智能管理软件7.0-PLG模式全新上线
- org.apache.flink.table.api.TableException: A raw type backed by type information has no serializable
- 分享国内外好用的H5页面制作网站
- iOS中 @synthesize 和 @dynamic 区别
- python设置分辨率和调整画布大小
- intellij idea 合并分支到主分支,主分支代码同步到某一分支