jquery实现light7的开关按钮的代码

<!DOCTYPE html><html><head>    <meta charset="utf-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <title>我的生活</title>    <meta name="viewport" content="initial-scale=1, maximum-scale=1">    <link rel="shortcut icon" href="/favicon.ico">    <meta name="apple-mobile-web-app-capable" content="yes">    <meta name="apple-mobile-web-app-status-bar-style" content="black">    <link rel="stylesheet" href="css/light7.min.css">    <link rel="stylesheet" href="css/light7-swiper.min.css">    <script type=‘text/javascript‘ src=‘js/jquery.js‘ charset=‘utf-8‘></script></head><body><!-- 你的html代码 --><div class="page">    <header class="bar bar-nav">        <a class="button button-link button-nav pull-left" href="/demos/card" data-transition=‘slide-out‘>            <span class="icon icon-left"></span>            返回        </a>        <h1 class="title">我的生活</h1>    </header>    <div class="content">        <div class="list-block">            <ul><li>                    <div class="item-content">                        <div class="item-inner">                            <div class="item-input">                                <label class="label-switch">                                    <input id="inpu" type="checkbox">                                    <div id="che1" class="checkbox"></div>                                </label>                            </div>                        </div>                    </div>            </li></ul>        </div><!--list-block-->        <div class="content-block">            <h1 id="h11">我是h1</h1>            <h6 style="display: none" id="h66">我是话</h6>
        </div>    </div><!--content--></div><script>    $("#inpu").click(function(){            if(this.checked) {                $("#h11").hide();                $("#h66").show();            }else {                $("#h11").show();                $("#h66").hide();            }    })</script><script type=‘text/javascript‘ src=‘js/light7.min.js‘ charset=‘utf-8‘></script><script type=‘text/javascript‘ src=‘js/light7-swiper.min.js‘ charset=‘utf-8‘></script></body></html>
时间: 2024-10-12 09:27:19

jquery实现light7的开关按钮的代码的相关文章

jquery实现的选项卡的嵌套代码实例

jquery实现的选项卡的嵌套代码实例:关于选项卡功能大家一定都不会陌生,无非就是鼠标点击或者悬浮能够切换相关的内容.通常情况下,大家见到的选项卡都是没有嵌套功能的,也就是说就是完成了一层切换效果,本章节分享一段代码实例,实现了选项卡的嵌套功能,也就是选项卡中嵌套有选项卡功能,也就能够容纳更多的内容.代码如下: <!DOCTYPE html><html> <head> <meta charset=" utf-8"> <meta na

通过javascript库JQuery实现页面跳转功能代码

通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum").val();//#gotopagenum是文本框的id属性 location.href = "NewList.aspx?pagenum="+pn;//location.href实现客户端页面的跳转 }); 实例2: 实现跳转:window.location = 'user!add.

使用jquery实现的多级树形菜单代码实例

使用jquery实现的多级树形菜单代码实例:树形菜单在网站中有大量的应用,这当然是因为它的独特优点,首先它可以有效的组织数据,使分类更为清晰明了,通常情况下树形菜单是可以折叠的,这样可以以更小的空间容纳更多的数据,下面就详细介绍一个使用jquery实现的属性菜单.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author&q

基于jQuery加载进度条特效代码

基于jQuery加载进度条特效代码是一款简单的加载新数据,获取数据jQuery进度条代码. 在线预览   源码下载 实现的代码. html代码: <div id="main"> <div class="demo"> <div class="bars"> <span id="bar">55</span> </div> <div class="

分享一个jquery功能强大的提示信息插件代码

代码属于提示文字特效,很好,使用有些复杂,请参demo使用 下载地址:jquery功能强大的提示信息插件代码 预览DEMO:DEMO 分享一个jquery功能强大的提示信息插件代码,布布扣,bubuko.com

分享一款jquery+css3实现的手风琴效果代码【js插件】

代码适用于大部分浏览器 演示Demo地址:请猛戳 效果图片 程序吧下载地址 分享一款jquery+css3实现的手风琴效果代码[js插件],布布扣,bubuko.com

css+jQuery制作的文字循环滚动代码

css+jQuery制作的文字循环滚动代码,尺寸只需要在css中调整即可,另外别忘记在function里面修改相关参数 百度网盘下载

基于jQuery网页步骤流程进度条代码

基于jQuery网页步骤流程进度条代码里面包含两款不同效果的jQuery步骤进度条特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="step_context test"></div> 当前步骤:第<input type="text" value="5" id="currentStepVal" />步 <button onclick=&qu

jquery为select添加option的代码探讨

这是一道讨论"使用jQuery为select添加option选项的最佳代码方法".分析哪一种的写法是最佳方法.在stackoverflow上众说纷纷,下面来看看有哪些写法. 第一种使用for循环 var selectValues = { "1": "test 1", "2": "test 2" }; for (key in selectValues) { if (typeof (selectValues[k