QQ客服
当前位置 : 江西快三计划 > 代码 > 网页特效 > 其它特效 > jquery借贷网站滑块拖动金额利息代码

快三玩法介绍: 原创商用 jquery借贷网站滑块拖动金额利息代码

jquery 实现金融借贷网滑块拖动借款额度以及借款期限效果代码,js css 分离,结构简单清晰,参数均可修改,下载即可使用。
[声明]该素材属于原创商用,未经允许请勿转载,内有版权说明,否则追究相应的法律责任。

使用方法:

1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css"/>

2、head引入js文件

<script type="text/javascript" src="js/jquery.js"></script>

3、body引入HTML代码

<div class="aui-content">
	<div class="aui-content-box">
		<div class="aui-header">
			 出借<span id="moneyValue">23.9万</span>元,<span id="dateValue">90</span>天项目,利息约为:<span id="profit">4007.34</span>元
		</div>
		<div class="aui-header-tag"></div>
		<div class="aui-amount">
			<div class="aui-head-title">出借金额</div>
			<div class="aui-amount-item">
				<span class="span-point aui-spacing" id="aui-circle">
					<img src="images/spotRed.png">
				</span>
				<div class="money-value-pos">
					<input type="radio" value="1000" name="mv" id="mv1">
					<label for="mv1">1000元</label>
					<div class="bubble">直投项目起投金额 1000元</div>
				</div>
				<div class="money-value-pos">
					<input type="radio" value="5000" name="mv" id="mv2">
					<label for="mv2">5000元</label>
					<div class="bubble">少数用户首次出借5千元</div>
				</div>
				<div class="money-value-pos">
					<input type="radio" value="10000" name="mv" id="mv3">
					<label for="mv3">1万元</label>
					<div class="bubble">多数用户首次出借1万元</div>
				</div>
				<div class="money-value-pos">
					<input type="radio" value="50000" name="mv" id="mv4">
					<label for="mv4">5万元</label>
					<div class="bubble">20%单笔出借额约5万元</div>
				</div>
				<div class="money-value-pos">
					<input type="radio" value="100000" name="mv" id="mv5">
					<label for="mv5">10万元</label>
					<div class="bubble">15%单笔出借额约10万元</div>
				</div>
				<div class="money-value-pos">
					<input type="radio" value="239000" name="mv" id="mv6" checked="">
					<label for="mv6">23.9万元</label>
					<div class="bubble" style="display: block;">人均出借金额为23.9万元</div>
				</div>
				<div class="money-value-pos" style="margin: 0;">
					<input type="radio" value="500000" name="mv" id="mv7">
					<label for="mv7">50万元</label>
					<div class="bubble">VIP单笔出借额约50万元</div>
				</div>
			</div>
		</div>
		<div class="investDate aui-term">
			<div class="aui-head-title">出借期限</div>
			<div class="date-value">
				<span class="span-point" id="aui-circle-two">
					<img src="images/spotRed.png">
				</span>
				<div class="date-value-pos">
					<input type="radio" value="21" name="itd" id="itd1">
					<label for="itd1">21天</label>
					<div class="bubble">新手体验项目 21天,6%+4%</div>
				</div>
				<div class="date-value-pos">
					<input type="radio" value="30" name="itd" id="itd2">
					<label for="itd2">30天</label>
					<div class="bubble">每月定存,轻松理财 30天,6.3%</div>
				</div>
				<div class="date-value-pos">
					<input type="radio" value="90" name="itd" id="itd3" checked="">
					<label for="itd3">90天</label>
					<div class="bubble" style="display: block;">明星产品人气爆款 90天,6.8%</div>
				</div>
				<div class="date-value-pos">
					<input type="radio" value="180" name="itd" id="itd4">
					<label for="itd4">180天</label>
					<div class="bubble">半年定存理财 180天,7%</div>
				</div>
				<div class="date-value-pos">
					<input type="radio" value="270" name="itd" id="itd5">
					<label for="itd5">270天</label>
					<div class="bubble">资金周转理财 270天,7.5%</div>
				</div>
				<div class="date-value-pos" style="margin: 0;">
					<input type="radio" value="365" name="itd" id="itd6">
					<label for="itd6">365天</label>
					<div class="bubble">收益Top,壕友偏爱 365天,7.8%</div>
				</div>
			</div>
		</div>
		<div class="aui-button">开始出借</div>
	</div>
</div>

<script type="text/javascript" src="js/script.js"></script> <!-- 先执行html 再执行jquery -->
下载素材后进行评论,每个素材只能评论一次。
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 江西快三计划

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
  • 信不信普京?特朗普给出了“谜之回答” 2018-09-08
  • 【理上网来喜迎十九大】越南专家点赞中国新发展理念 2018-09-08
  • 中央第四环保督察组向江西移交1034件信访问题线索 2018-07-25
  • 探寻南极之境 送给世界尽头的一封情书 2018-07-25
  • 最纯正港片回归《泄密者》点燃暑期档 2018-07-24
  • 游走休闲马德里,做一个阳光收割机 2018-07-23
  • 东方明珠广播电视塔天气,东方明珠广播电视塔天气预报,东方明珠广播电视塔天气预报一周 2018-07-23
  • 险企偿付能力2017年“成绩单”:3家不达标 7家被关注 2018-07-22
  • 亦庄人大附实验学校3年内投用 2018-07-22
  • 【理上网来·喜迎十九大】坚守理想信念补足精神之“钙” 2018-07-21
  • 《中国国家地理》杂志社在拉萨林周县举行“黑颈鹤观察拍摄基地”授牌仪式文章中国国家地理网 2018-07-21
  • 《2018年一季度人民日报·政务指数微博影响力报告》发布 2018-07-20
  • “王祖蓝与他的朋友们”开票 爆款海报闪亮平安夜王祖蓝与他的朋友们 2018-07-19
  • 680| 925| 816| 616| 548| 768| 358| 860| 179| 717|