uniapp刻度尺的实现(swiper)滑动打分器

实现图(百分制):滑动swiper进行打分,分数加减

在这里插入图片描述

<view class="scoring">
	<view class="toggle">
		<view class="score">
			<text>{
  
  {'0'}}</text>
			<view class="scoreId" >
				<block v-if="transFlag&&scoreFlag">{
  
  {testScore}}</block>
				<block v-else>{
  
  {currentScore}}</block>
			</view>
			<text>{
  
  {'100'}}</text>
		</view>
		<view>
			<view class="line-con">
				<text class="line
setTimeout(function(){ var n =0; var u,end,start,g,g2; var w0 = 50; var w1 = 10.4; var w2=52; var heightVal =$("div[data-page='profile1']").find(".row").eq(1).find(".number").attr("initial-value"); //150-140 var widthVal =$("div[data-page='profile1']").find(".row").eq(2).find(".number").attr("initial-value"); //550-300 /2.5 /10 保留最后一们小数 var ageVal = $("div[data-page='profile1']").find(".row").eq(0).find(".number").attr("initial-value"); //30-18 var mouVal=$("div[data-page='profil']") $('.ruler .main').eq(0).css({ '-webkit-transform':'translateX(-'+Math.ceil(parseInt(ageVal*w0))+'px)' }).attr('value',Math.ceil(ageVal*w0)); $('.ruler .main').eq(1).css({ '-webkit-transform':'translateX(-'+parseInt(heightVal*w1)+'px)' }).attr('value',heightVal*w1); $('.ruler .main').eq(2).css({ '-webkit-transform':'translateX(-'+parseInt(widthVal*w2)+'px)' }).attr('value',widthVal*w2); for( var i =0 ; i < $('.ruler').length; i++){ var liW = $('.ruler').eq(i).find("li").width(); var size = $('.ruler').eq(i).find('li').size(); } $('body').on('touchcancel,touchend,touchmove,touchstart',function(e){ e.preventDefault(); }) $('.selectize li').on('touchstart',function(){ $(this).addClass("hover").siblings("li").removeClass("hover"); }) $('.selectize li').on('touchsend',function(){ $(this).removeClass("hover"); }) $('.ruler ul').on("touchstart",function(e){ var initial = $(this).attr('data-initial'); e.stopPropagation(); v = parseInt($(this).parent(".main").attr('value')); if($(this).closest('.ruler').hasClass("ruler-weight")){ start = 0; end = '-1458'; g = 52; }else if($(this).closest('.ruler').hasClass("ruler-age")){ start = 0; end = '-1600'; g = 50; }else{ start = 0;
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值