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. SpringBoot学习笔记(13)----使用Spring Session+redis实现一个简单的集群

    session集群的解决方案: 1.扩展指定server 利用Servlet容器提供的插件功能,自定义HttpSession的创建和管理策略,并通过配置的方式替换掉默认的策略.缺点:耦合Tomcat/ ...

  2. JAVA调用接口

    HttpUrlconnection部分 //发送JSON字符串 如果成功则返回成功标识. public static String doJsonPost(String urlPath, String ...

  3. NOIp模拟赛三十一

    持续降智 分数:100+0+0=100 C题subtask是假的,根本没有部分分中的情况...还我20分QAQ A:[BZOJ4444]国旗计划 B:[agc006f]blackout C:[arc0 ...

  4. 解决new Date的值为Invalid Date、NaN-NaN的问题

    错误代码: let timespan = 1515239514230; let dateTime = new Date(timespan); console.log(dateTime) // 返回 I ...

  5. argparse模块入门介绍——基于python3.7

    转载:https://blog.csdn.net/weixin_41796207/article/details/80846406 首先说明,本人是想要学习如何使用argparse模块,打造命令行程序 ...

  6. HDU 4069 数独

    好久没做题了,建图搞了好久…… 然后,判是否有多解的时候会把原来的答案覆盖掉…… 这里没注意,弄了一下午…… 代码: #include <iostream> #include <cs ...

  7. 题解 P3413 【SAC#1 - 萌数】

    这道题刚开始正向思维,然后处理重复的时候咕咕了. 参考了@巨型方块 大佬的题解后AC了,在这里就说几个我觉得比较重要或是容易被忽略的点,然后补充一些跳过的证明. 这道题的状态可以设为$dp[i][j] ...

  8. 【codeforces 95C】Volleyball

    [题目链接]:http://codeforces.com/problemset/problem/95/C [题意] 给你n个点,m条边; 每个点有一辆出租车; 可以到达离这个点距离不超过u的点,且在这 ...

  9. Mysql学习总结(25)——MySQL外连接查询

    1.左外连接left outer join或者left jion,outer可以省略不写,下边的右连接和全连接也一样: 左外连接的意思是,以left join左边的表中的数据为基准,即左边的表中有的必 ...

  10. Linux平台不同解压缩命令的使用方法

    作者:郭孝星 微博:郭孝星的新浪微博 邮箱:allenwells@163.com 博客:http://blog.csdn.net/allenwells github:https://github.co ...