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

滚动条组件

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"
			/>
相关推荐
青企通5 分钟前
电动车门店小程序:以旧换新估价、维修工单与电池档案的设计实现
小程序
努力变的更好28 分钟前
H5与小程序之间的回调
前端·小程序·apache
甜到心里的蛋糕31 分钟前
抖音评论自动回复机器人部署实践:无头 Chrome + DeepSeek + NapCat(2C2G 云主机)
java·jvm·chrome·python·抖音·deepseek
lily5227831 小时前
工具池与分发
前端·chrome
甜到心里的蛋糕2 小时前
AI 生成 MV 音频异响排查:频谱定位、片段替换与 Nginx 缓存
人工智能·python·nginx·ffmpeg·音视频·音频处理
镭封12 小时前
从视频文案提取到 AI 配音,短视频制作需要哪些工具?
人工智能·智能手机·音视频·语音识别·媒体
2601_9556624614 小时前
搞笑视频配音怎么做?如何选择有辨识度的声音
大数据·人工智能·音视频·语音识别·媒体
镭封17 小时前
自媒体内容生产怎么提速?文案整理、配音与剪辑流程
人工智能·小程序·音视频·语音识别·媒体
科威网络18 小时前
小程序开发性能优化:分包、预加载与启动时间
性能优化·微信小程序·小程序
2601_9654490818 小时前
AI视频制作:做传统文化视频,古文断句配音难,AI怎么正确断句配音?
人工智能·音视频