var lis = $(".proDetail_contentnav li");
for(var i = 0; i < lis.length; i++) {
lis[i].index = i;
$(".proDetail_contentnav li").click(function() {
$(".proDetail_contentnav li").css({
"color": "#3c3c3c",
"background": "transparent"
});
$(this).css({
"color": "#ffffff",
"background": "#2078D2"
});
k = this.index;
$(".proDetail_content").hide();
$(".proDetail_content").eq(k).show();
})
}

此处只粘贴js代码,自设置css布局

获取下标实现导航切换jquery代码的更多相关文章

  1. tab切换jquery代码

    http://immmmm.com/jquery-tab-switch-code-improved.html html <div id="sidebar-tab">   ...

  2. jQuery旋转木马仿3D效果的图片切换特效代码

    用jQuery实现的一款仿3D效果的图片切换特效代码,类似旋转木马一样,幻灯图片以三维视觉上下滑动切换,效果很酷炫,兼容IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜 ...

  3. jQuery实现的鼠标滑过切换图片代码实例

    jQuery实现的鼠标滑过切换图片代码实例:有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍 ...

  4. 20款jquery下拉导航菜单特效代码分享

    20款jquery下拉导航菜单特效代码分享 jquery仿京东商城左侧分类导航下拉菜单代码 jQuery企业网站下拉导航菜单代码 jQuery css3黑色的多级导航菜单下拉列表代码 jquery响应 ...

  5. jQuery雷达扫描切换幻灯片代码

    基于jQuery雷达扫描切换幻灯片代码.这是一款切换效果类似雷达扫描,支持鼠标滚轮滚动切换.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=" ...

  6. 基于jQuery左右滑动切换图片代码

    分享一款基于jQuery左右滑动切换图片代码.这是一款基于jQuery实现的左右滑动切换焦点图代码.效果图如下: 在线预览   源码下载 实现的代码: <div class="v_ou ...

  7. selenium常用操作,查找元素,操作Cookie,获取截图,获取窗口信息,切换,执行js代码

    目录: 1. 常用操作 2. 查找元素 3. 操作Cookie 4. 获取截图 5. 获取窗口信息 6. 切换 7. 执行JS代码 简介 selenium.webdriver.remote.webdr ...

  8. 分享一款页面视差滚动切换jquery.localscroll插件

    今天给大家分享一款页面视差滚动切换jquery.localscroll插件. 滚动鼠标液动条看下页面的切换效果.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera ...

  9. HTML 学习笔记 JQuery(锋利的JQuery 代码)

    一 制作简单的导航栏 <html> <head> <meta charset="UTF-8"> <title></title& ...

随机推荐

  1. 获取微信用户openid

    获取微信用户openid http://blog.csdn.net/qq_24800377/article/details/53437040 easywechat 简易演示php代码 http://w ...

  2. Appium+python自动化29-toast消息(亲测 ok)

    本篇转自博客:上海-悠悠 前言 appium1.5以后的版本才支持toast定位,并且 'automationName'得设置为'Uiautomator2',才能捕获到. 一. Supported P ...

  3. java代码关于匿名内部类和接口的方法使用

    总结:主要是多个按钮实现监听时,能够响应不同的事件 以上步骤我们可以用多种方法实现.但人们通常用二种方法.第一种方法是只利用一个监听器以及多个if语句来决定是哪个组件产生的事件:第二种方法是使用多个内 ...

  4. jdk8的扩展注解

    对于注解(也被称做元数据),Java 8 主要有两点改进:类型注解和重复注解. 1.类型注解 1)Java 8 的类型注解扩展了注解使用的范围. 在java 8之前,注解只能是在声明的地方所使用,ja ...

  5. 分布式缓存系统 Memcached 内存管理机制

    在前面slab数据存储部分分析了Memecached中记录数据的具体存储机制,从中可以看到所采用的内存管理机制——slab内存管理,这也正是linux所采用的内存高效管理机制,对于Memchached ...

  6. php代码优化 -- array_walk 和 foreach, for 的效率的比较

    <?php /** * array_walk 和 foreach, for 的效率的比较. * 我们要测试的是foreach, for, 和 array_walk的效率的问题. */ //产生一 ...

  7. python开发函数进阶:装饰器

    一,装饰器本质 闭包函数 功能:就是在不改变原函数调用方式的情况下,在这个函数前后加上扩展功能 作用:解耦,尽量的让代码分离,小功能之前的分离. 解耦目的,提高代码的重用性 二,设计模式 开放封闭原则 ...

  8. (转)Docker - 创建 Docker overlay network (containers 通信)

    原文链接: http://www.cnblogs.com/AlanWalkOn/p/6101875.html --- 创建基于Key-Value的Docker overlay network. 这样运 ...

  9. 自己写着玩的一个天气APP

    打开的界面: 向上滑动,进入主界面: 省份界面: 城市界面: 加载天气界面: 显示天气界面: 侧滑,显示地区,然后根据天气来显示一首诗句(晴,多云,雪,雨什么的): 第一次启动App的时候才会加载数据 ...

  10. Hibenate错误汇总:java.lang.NoClassDefFoundError: org/jboss/logging/BasicLogger

    转自:https://bioubiou.iteye.com/blog/1769950 1 Hibenate异常汇总:java.lang.NoClassDefFoundError: org/jboss/ ...