jquery切换
- <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
- <style>
- ul{
- list-style: none;
- }
- ul li{
- float: left;
- padding: 10px;
- border: 1px solid black;
- margin-right: 10px;
- }
- .active{
- background: green;
- color: white;
- }
- </style>
- <div class="delivery-tab">
- <ul>
- <li class="active">普通</li>
- <li>文件</li>
- <li>易碎</li>
- <li>数码</li>
- <li>美食</li>
- <li>鲜花</li>
- <li>蛋糕</li>
- <li>生鲜</li>
- </ul>
- </div>
- <script>
- $('.delivery-tab ul li').click(function () {
- $(this).addClass('active').siblings().removeClass('active');
- $(this).siblings().children('input').removeAttr('checked', true);
- });
- </script>
jquery切换的更多相关文章
- jQuery切换网页皮肤保存到Cookie实例
效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/25.htm 以下是源代码: <!DOCTYPE html PUBLIC "-//W3C//D ...
- jquery切换tab标签例子
之前做了一个简单的小效果,使用jquery方式,让tab标签切换,效果如下 代码其实很简单,首先先把代码分享给大家,代码如下 var shoptoggle = $('.shoptoggle .shop ...
- jQuery切换网页皮肤并保存到Cookie示例代码
经过使用,靠谱! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...
- jQuery切换事件
有html页面内容如下: <body> <h5 id="hh">关于jQuery的介绍</h5> <p id="p1" ...
- jQuery 切换图片(图标)效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQuery——切换toggle
toggle()-----显示隐藏 toggleClass-------添加类或者删除类 <!DOCTYPE html> <html lang="en"> ...
- jquery切换class
<ul class="nva_sele_txt" id=""> <a href="#" class= ...
- jQuery实现的鼠标滑过切换图片代码实例
jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...
- 10 款基于 jQuery 的切换效果插件推荐
本文整理了 10 款非常好用的 jQuery 切换效果插件,包括平滑切换和重叠动画等,这些插件可以实现不同元素之间的动态切换. 1. InnerFade 这是一个基于 jQuery 的小插件,可以实现 ...
随机推荐
- dnspython模块安装
wget http://www.dnspython.org/kits/1.12.0/dnspython-1.12.0.tar.gz tar -zxvf dnspython-1.12.0.tar.gz ...
- JetBrains Rider 破解 (ideaIU等等开发工具都通用)2018-02-27
贴一下Rider下载地址:(下载不了可以用百度云离线下载) Win:https://download.jetbrains.com/resharper/JetBrains.Rider-2017.3.1. ...
- linux磁盘及分区详解
1.Linux 分区简介 1.1 主分区 vs 扩展分区 硬盘分区表中最多能存储四个分区,但我们实际使用时一般只分为两个分区,一个是主分区(Primary Partion)一个是扩展分区(extend ...
- Python自动化--语言基础5--面向对象、迭代器、range和切片的区分
面向对象 一.面向对象代码示例: 1 class Test(): #类的定义 2 car = "buick" #类变量,定义在类里方法外,可被对象直接调用,具有全局效果 3 def ...
- 标准Http协议的六种请求方法详解
标准Http协议支持六种请求方法,即: 1.GET 2.POST 3.PUT 4.Delete 5.HEAD 6.Options 但其实我们大部分情况下只用到了GET和POST.如果想设计一个符合RE ...
- Springmvc 中org.springframework.http.converter.json.MappingJackson2HttpMessageConverter依赖jackson包
1,问题详情:Spring使用4.3.5.Release版本后 在SpringMvc配置文件中配置json 解析器后出现报错信息 [org.springframework.web.context.Co ...
- Yii2数据库操作再总结
User::find()->all(); 此方法返回所有数据:User::findOne($id); 此方法返回 主键 id=1 的一条数据(举个例子): User::find()->wh ...
- Python 关于super 的 用法和原理(挖坑)
一.前言 Python 面向对象中有继承这个概念,初学时感觉很牛逼,里面也有个super类,经常见到,最近做一些题才算是理解了.特地记录分享给后来研究的小伙伴,毕竟现在小学生都开始学了(滑稽脸) 二. ...
- LOJ6002 - 「网络流 24 题」最小路径覆盖
原题链接 Description 求一个DAG的最小路径覆盖,并输出一种方案. Solution 模板题啦~ Code //「网络流 24 题」最小路径覆盖 #include <cstdio&g ...
- 为什么在Python里推荐使用多进程而不是多线程
转载 http://bbs.51cto.com/thread-1349105-1.html 最近在看Python的多线程,经常我们会听到老手说:"Python下多线程是鸡肋,推荐使用多进程 ...