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. Linux Samba目录服务搭建与Java客户端访问

    前言: 本文比较简略,只求快速入门,若要了解详情,推荐一篇文章:http://www.cnblogs.com/mchina/archive/2012/12/18/2816717.html 1,安装sa ...

  2. 分布式缓存系统 Memcached 工作线程初始化

    Memcached采用典型的Master-Worker模式,其核心思想是:有Master和Worker两类进程(线程)协同工作,Master进程负责接收和分配任务,Worker进程负责处理子任务.当各 ...

  3. NOIP 2008 立体图 (字符串+模拟)

    立体图 时间限制: 1 Sec  内存限制: 50 MB提交: 2  解决: 0[提交][状态][讨论版][命题人:外部导入] 题目描述 小渊是个聪明的孩子,他经常会给周围的小朋友们讲些自己认为有趣的 ...

  4. mysql数据增删查授权

    一 介绍 MySQL数据操作: DML ======================================================== 在MySQL管理软件中,可以通过SQL语句中的 ...

  5. AngryFuzz3r-web扫描工具

    项目地址:https://github.com/ihebski/angryFuzzer 下载完后打开文件 安装一下所需的Python模块 root@sch01ar:/sch01ar/angryFuzz ...

  6. 9.solr学习速成之group

    Group与Facet的区别  facet的查询结果主要是分组信息:有什么分组,每个分组包括多少记录:但是分组中有哪些数据是不可知道的,只有进一步搜索.        group则类似于关系数据库的g ...

  7. linux 下安装mysql-5.7.16

    1.解压tar -xvf mysql的包 tar -xvf mysql-5.7.16-1.el6.x86_64.rpm-bundle.tar(mysql 官网中即可找到) 2.查看是否需要卸载安装时候 ...

  8. JAVA的FileOutput/InputStream使用实例

    在JAVA中,要读写文件,要使用Stream这个东西. Stream简单来说,可以看做在程序和文件之间打开了一个管道,然后把数据通过这个管道输送到文件或程序中去. FileOutput/InputSt ...

  9. LINUX免密登陆

    ssh 无密码登录要使用公钥与私钥.linux下可以用用ssh-keygen生成公钥/私钥对,下面我以CentOS为例. 有机器A(192.168.1.155),B(192.168.1.181).现想 ...

  10. leetcode605

    public class Solution { public bool CanPlaceFlowers(int[] flowerbed, int n) { && flowerbed[] ...