<!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>

　　

jquery模拟checkbox效果，以及background-size在jquery中的使用。的更多相关文章

  1. 利用jquery模拟select效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. C#中??和？分别是什么意思？ 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中，对象相等和对象一致分别指的是什么？

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

  3. 基于jquery横向手风琴效果

    基于jquery横向手风琴效果是一款基于jquery实现的左右滑动手风琴图片轮播切换特效.效果图如下: 在线预览   源码下载 效果图如下: <div class="flash&quo ...

  4. jQuery实现模拟滚动条效果；

    滚动条在web开发中,很常见,原生的HTML滚动条很难看,因此很多网站借助JS来模拟实现滚动条效果: 滚动条的实现原理其实比较简单,拿垂直滚动条来说: 1),最外层容器需要设置overflow:hid ...

  5. Jquery模拟多选框(checkbox)

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  6. jquery模拟下拉框单选框复选Select，Checkbox，Radio

    在项目中,你会发现设计稿中常常会有单选框,复选框,但都不是系统默认的样式,这就可以用jquery来模拟它们:如图所示,实现它们所需要的代码如下: 首先需要引入的代码: <link rel=&qu ...

  7. jQuery效果之封装模拟placeholder效果，让低版本浏览器也支持

    页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...

  8. 手机端touch事件 jquery模拟

    ontouchstart实现手机触屏中的hover效果 ontouchstart实现手机触屏中的hover效果 最近一直都在做手机网站的项目,会经常遇到手机屏幕触摸无交互效果,今天在一篇文章中看到模拟 ...

  9. jQuery模拟原生态App上拉刷新下拉加载

    jQuery模拟原生态App上拉刷新下拉加载效果代码,鼠标上拉时会显示loading字样,并且会模拟加载一条静态数据,支持触屏设备使用. <!doctype html> <html ...

随机推荐

  1. （转）CSS 禁止浏览器滚动条的方法

    1.完全隐藏 在里加入scroll="no",可隐藏滚动条:    这个我用的时候完全没效果,不知道是什么原因!不过好多人说这么用可以,大概是用的位置不一样吧   2.在不需要时隐 ...

  2. GDI+(Graphics Device Interface)例子

    使用SolidBrush 单色画笔 Bitmap bitmap = new Bitmap(800, 600);            Graphics graphics = Graphics.From ...

  3. [转]C++学习心得

    1.把C++当成一门新的语言学习: 2.看<Thinking In C++>: 3.看<The C++ Programming Language>和<Inside The ...

  4. C++中使用stringstream简化类型转换

    C++标准库中的<sstream>提供了一个stringstream,以前基本没用过,突然发现很好用(^-^)V 参见 http://www.cplusplus.com/reference ...

  5. 【android】修改android默认应用图标

    我自己做的一个小程序,想更改程序安装后的默认显示图片,但是我发现只能改一次,以后再改还是显示第一次更改后的图片(此时我已把最后一次更改前的全部图片都删除了,所以不会是名称填错),这是为什么??求高人指 ...

  6. The Suspects（POJ 1611 并查集）

    The Suspects Time Limit: 1000MS   Memory Limit: 20000K Total Submissions: 30158   Accepted: 14665 De ...

  7. C语言解析日志，存储数据到伯克利DB 2

    #编译程序 gcc -o historydb historydb.c -ldb #将2013年8月9日的用户记录写入数据库 (程序自动识别新用户入库,跳过老用户) ./historydb -f .us ...

  8. yii生成webapp

  9. ActionBar Fragment运用最佳实践

    ActionBar Fragment运用最佳实践  

  10. linux下C和shell调用的popen函数

    说明:      本文介绍popen函数的使用方法和行为机理,并给出实际的例子来辅助说明了popen函数的使用方法. popen函数使用FIFO管道执行外部程序,首先让我们看看popen的函数原型吧: ...