var $ranklist_li = $("div.ranklist_model ul li");
$ranklist_li.hover(function () {
$(this).addClass("current").siblings().removeClass("current");
var index = $ranklist_li.index(this); //获取当前点击li元素在所有li元素中的索引
$("div.tab_box > div").eq(index).show().siblings().hide();
}); var $list_li = $(".m_list li");
$list_li.hover(function () {
$(this).addClass("eat_me").removeClass("drink_me").siblings().removeClass("eat_me").addClass("drink_me");
});

记录一下。方便之后查看

伸缩--也可用于tabs的更多相关文章

  1. 【转】Flexbox——快速布局神器

    原文转自:http://www.w3cplus.com/css3/flexbox-basics.html 简介 在很多方面HTML和CSS是一个强大的内容发布机制——易学.灵活和强大.但复杂的布局是他 ...

  2. Deis logo 开源PaaS系统 Deis

    Deis 是一个 Django/Celery API 服务器.Python CLI 和一组 Chef cookbooks 合并起来提供一个类似 Heroku 的应用平台,用于公有云和私有云.Deis ...

  3. Flexbox——快速布局神器

    Flexbox通常能让我们更好的操作他的子元素布局,例如: 如果元素容器没有足够的空间,我们无需计算每个元素的宽度,就可以设置他们在同一行: 可以快速让他们布局在一列: 可以方便让他们对齐容器的左.右 ...

  4. flexbox的术语

    在详细阅读这篇文章之前,我们很有必要先了解flexbox的几个常用术语,这样有助于大家对后文的理解. 伸缩容器:一个设有“display:flex”或“display:inline-flex”的元素 ...

  5. Flexbox布局详解

    弹性框布局 (flexbox) 添加了级联样式表级别 2 修订版 1 (CSS2.1) 中定义的四个基本布局模式:块布局.内联布局.表格布局和定位布局.使用弹性框布局功能,你可以更加轻松地设计复杂网页 ...

  6. [转载]你所不了解的DevOps

    DevOps开发运维训练营 一旦建立了创新的文化,即使那些并非科学家或者工程师的人——诗人.演员.记者——也能以团体的形式,接受科学文化的意义.他们信奉创新文化的概念.他们以促进这种文化的方式投票.他 ...

  7. 云计算时代,你所不了解的 DevOps

    在本文中,我们讨论如何快速地从更高的层面理解DevOps,介绍准备改变文化的最佳实践.我们将讨论DevOps的目标以及从组织管理层得到支持的方法,为DevOps的概念打下基础.我们将试着从根本上介绍使 ...

  8. Spring Security 5.0.x 参考手册 【翻译自官方GIT-2018.06.12】

    源码请移步至:https://github.com/aquariuspj/spring-security/tree/translator/docs/manual/src/docs/asciidoc 版 ...

  9. jquery.UI.tabs

    今天对jquery UI的tabs进行了进一步的了解,目的是想把死板的切换效果变得动感点,不过经过这进一步的了解,发现它并不合适或都说并不能实现我想要的效果,我想要的效果就是类似淘宝商城的banner ...

随机推荐

  1. Golang 中的 面向对象: 方法, 类, 方法继承, 接口, 多态的简单描述与实现

    前言: Golang 相似与C语言, 基础语法与C基本一致,除了广受争议的 左花括号 必须与代码同行的问题, 别的基本差不多; 学会了C, 基本上万变不离其宗, 现在的高级语言身上都能看到C的影子; ...

  2. 在远程X server上显示图形的设置方法

    1.在服务器的/etc/ssh/sshd_config中,设置X11Forwarding yes,然后重启ssh服务,cd /etc/init.d这个目录下执行 ./ssh restart 2.在客户 ...

  3. TypeError: Cannot use 'in' operator to search for 'length' in....

    前台页面读取商品属性是字符串形式,数据库中存储商品属性是集合形式,前台数据存入数据库中数据格式会自动转,后台数据回显到前台数据格式需要手动转换,否则会报异常 错误信息提示:

  4. 转义JavaScript特殊字符

    JavaScriptUtils.javaScriptEscape("%admin' or '1=1") //转义JavaScript特殊字符

  5. [SHOI2009]Booking 会场预约

    题目:洛谷P2161. 题目大意:有一些操作,分为两种: A.增加一个从第l天到第r天的预约,并删除与这个预约冲突的其他预约,输出删除了多少个预约. B.输出当前有效预约个数. 两个预约冲突定义为两个 ...

  6. Python求阴影部分面积

    一.前言说明 今天看到微信群里一道六年级数学题,如下图,求阴影部分面积 看起来似乎并不是很难,可是博主添加各种辅助线,写各种方法都没出来,不得已而改用写Python代码来求面积了 二.思路介绍 1.用 ...

  7. Unity Microphone 无限时长录制

    原创文章:转载请标明出处--博客园 Jason_c Unity可以很方便的通过 Microphone.Start()方法来调用麦克风,但是有一个弊端是,必须传入时长,这就很尴尬了,因为大多数时间,我们 ...

  8. java 项目 导入成功后jsp页面报错处理方法

    本人新导入一个maven项目可是jsp页面一直报错,我先按照网上的经验操作如下步骤: 在pom.xml配置文件中添加上javax.servlet的相关依赖: <dependency>  & ...

  9. swift学习笔记(五)构造过程

    构造过程是为了使用某个类.结构体或枚举类型的实例而进行的准备过程.在构造过程中,对每一个属性进行了初始值预设和其它必要的准备和初始化工作. 与OC相比,swift的构造函数.不须要返回值.同一时候,在 ...

  10. leetCode解题报告5道题(七)

    题目一:Interleaving String Given s1, s2, s3, find whether s3 is formed by the interleaving of s1 and s2 ...