【小程序 滚动条 滑块 音频 组件】

滚动条组件

1. scroll-view
视图容器内
2. scroll-x
允许横向滚动
3. scroll-y
允许纵向滚动
4. scroll-into-view="childs"
绑定子元素
5. scroll-top
竖向滚动条位置
6. scroll-left
横向滚动条位置
7. scroll-into-view
值应为某子元素id(id不能以数字开头)设置哪个方向可滚动,则在哪个方向滚动到该元素
8. scroll-with-animation
在设置滚动条位置时使用动画过渡

绑定滚动条事件:

bind:scroll="scroll"

注:scroll( ) -- 函数事件名

固定定位

  1. scroll-x 允许横向滚动
  2. scroll-y 允许纵向滚动
bash 复制代码
	<scroll-view class="box" 
			scroll-x="{{true}}" 
			scroll-y="{{true}}"
			bind:scroll="scroll">
			<view class="boxs">
			<!-- text 的值被固定在一个位置 -->
			<text style="{{sty}}">固定位置</text>
	</scroll-view>
	

wxml中设置函数名( ){ }

bash 复制代码
	 函数(){
	 if(e.detail.scrollTop>=1){
				this.setData({
				// text 的值被固定在一个位置  
				// 固定到一定距离会显示背景
				// wx.pageScrollTo()
				// slider
					sty:"position:fixed;background-color:red;"
				})
			}
			else if(e.detail.scrollTop>=2){
			e.detail.scrollTop = 0 ;
		}
	}

slider 滑块

slider 滑块 设置声音大小 亮度等...

bash 复制代码
		<slider bindchange="SliD"
				bindchanging="SliD"
				step="1"
				min="2" 
				max="20"
				show-value="true"
				value="5"
				activeColor="blue"
				block-size="5"
				backgroundColor="red"
			/>
相关推荐
root_1016 分钟前
kylin-v10-sp3-x86系统安装vmware-17
大数据·chrome·kylin
狗凯之家源码网32 分钟前
苹果 CMS10 酷黑渐变视频站模板落地应用指南
音视频
ai产品老杨1 小时前
架构师视点:基于 Docker 与边缘计算的百路异构视频中台,如何实现 GB28181/RTSP 统一接入与源码交付?
docker·音视频·边缘计算
EasyGBS1 小时前
延迟直降90%!国标GB28181视频平台EasyGBS支持WebRTC WHIP推流设备接入,让万物互联更简单
音视频·webrtc
u152109648491 小时前
S.S.Audio PRO A202 音频隔离器
音视频·实时音视频·视频编解码·视频·被复线
协享科技1 小时前
AI 视频理解:让 Agent 看视频并总结内容
人工智能·go·音视频·agent·ai编程
searchforAI1 小时前
2026国产AI笔记工具横评:Get笔记、Ai好记、通义听悟、BiBiGPT各有什么特色?
人工智能·笔记·学习·ai·音视频·知识图谱·知识库
hz567891 小时前
基于音视频 PaaS 的实时音视频解决方案:技术架构与落地实践
安全·架构·音视频·实时音视频·信息与通信·paas
Devin~Y2 小时前
大厂 Java 面试实录:从音视频内容社区到 AI RAG 的全链路技术设计
java·spring boot·redis·spring cloud·微服务·kafka·音视频
ai产品老杨2 小时前
打破芯片壁垒:基于 Docker 与边缘计算的异构视频中台架构设计,如何通过 GB28181/RTSP 统一接入与源码交付节省 95% 开发成本?
docker·音视频·边缘计算