jquery模拟checkbox效果，以及background-size在jquery中的使用。
2024-09-12 01:28:53
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>金击子智能终端-交易室</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0"/>
<meta name="description" content="">
<meta name="keywords" content="">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript"src="js/fontsize.js"></script>
<script type="text/javascript" src="js/touch.js"></script>
<link href="css/jys.css" rel="stylesheet"></head>
<body>
<div class="wrapper">
<div class="header">交易室</div>
<div class="notice">
<div class="left">声明</div>
<div class="right">
我们贯彻中立的角色，不倾向于任何金融产品，从客户的利益出发。我们从环球金融市场中挑选优秀的理财产品，构建最适合客户的投资组合方案。我们致力成为亚洲区内其中一间最具规模的独立理财顾问公司。
</div>
</div>
<div class="checkbox">
<div class="vip1">
<div class="c-header">
<img src="data:images/header2.png" class="header-img">普通会员</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>交易圈</span>
<input type="checkbox" ></div>
<div class="name">
<img src="data:images/icon1.png">
<span>YY同步</span>
<input type="checkbox" ></div>
</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>牛牛挂单</span>
<input type="checkbox" ></div>
<div class="name">
<img src="data:images/icon1.png">
<span>掌上分析师</span>
<input type="checkbox" ></div>
</div>
</div>
</div>
<div class="checkbox">
<div class="vip1">
<div class="c-header c-header2">
<img src="data:images/header.png" class="header-img">VIP会员</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>早/晚内参</span>
<input type="checkbox" disabled="disabled" ></div>
<div class="name">
<img src="data:images/icon1.png">
<span>金点股</span>
<input type="checkbox" disabled="disabled"></div>
</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>蝴蝶指标</span>
<input type="checkbox" disabled="disabled"></div>
<div class="name">
<img src="data:images/icon8.png">
<span>财迷广播</span>
<input type="checkbox" disabled="disabled"></div>
</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>大事件</span>
<input type="checkbox" disabled="disabled" ></div>
<div class="name">
<img src="data:images/icon1.png">
<span>神算子</span>
<input type="checkbox" disabled="disabled"></div>
</div>
<div class="content">
<div class="name">
<img src="data:images/icon1.png">
<span>盈利种子</span>
<input type="checkbox" disabled="disabled" ></div>
<div class="name">
<img src="data:images/icon1.png">
<span>邮币卡</span>
<input type="checkbox" disabled="disabled" ></div>
</div>
</div>
</div>
<div class="r-more">
<a href="">确定选择</a>
</div> </div>
</body>
</html>
<script type="text/javascript">
function more(){
alert(1);
this.innerHTML='1';
} $(function () {
$(".wrapper .record .r-main .r-more a").attr('ontouchstart', 'hover(this)');
$(".wrapper .record .r-main .r-more a").attr('ontouchend', 'mouseout(this)');
})
$('input:checkbox').each(function(){
var _disable = $(this).attr("disabled");
if(_disable == 'disabled'){
$(this).css({'background':'url(images/disable.png) 0px 0px / 0.8rem 0.8rem'})
}
$(this).click(function(){
var _check = $(this).is(':checked')
if(_check == true){
$(this).addClass('checked') }else if(_check == false){
$(this).removeClass('checked')
}
}) })
</script>
jquery
<script type="text/javascript">
function more(){
alert(1);
this.innerHTML='1';
} $(function () {
$(".wrapper .record .r-main .r-more a").attr('ontouchstart', 'hover(this)');
$(".wrapper .record .r-main .r-more a").attr('ontouchend', 'mouseout(this)');
})
$('input:checkbox').each(function(){
var _disable = $(this).attr("disabled");
if(_disable == 'disabled'){
$(this).css({'background':'url(images/disable.png) 0px 0px / 0.8rem 0.8rem'})
}
$(this).click(function(){
var _check = $(this).is(':checked')
if(_check == true){
$(this).addClass('checked') }else if(_check == false){
$(this).removeClass('checked')
}
}) })
</script>
最新文章
- dev c++ Boost库的安装
- [WCF编程]5.绑定概述
- 获取使用ClickOnce部署的应用程序的版本号
- XML代码生成器——XMLFACTORY 简介（二）
- Java基础知识：代理
- 攻城狮在路上（壹） Hibernate（十一）--- 映射实体关联关系
- chm格式文件能打开，但看不到内容问题
- linux终端-console
- IA32系统级架构总览（一） 实模式和保护模式
- POJ 3630 Phone List Trie题解
- PopupMenu消失(Dismiss)抓住
- utf8 和 UTF-8 在使用中的差别
- @Autowired标签与 @Resource标签 的区别
- 抓包工具 - HttpWatch
- C# 使用Task实现任务超时，多任务一起执行
- Python爬虫下载美女图片（不同网站不同方法）
- 通过C#发送自定义的html格式邮件
- ACL认证 vs 密码认证
- Oracle 12C -- 网络性能调优
- 【转载】MongoDB集群和实战详解