<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>jQuery</title>
<style>
ul, li{list-style:none;}
#linTab ul li{float:left;width:50px;}
.clearBoth{clear:both;}
.on{display:block;}
.none{display:none;}
</style>
<script src="./jquery/jquery-1.7.1.min.js"></script>
<script>
$(document).ready(function(){
    $change_li = $(".linListTab li");
    $change_li.each(function(i){
        $(this).mouseover(function(){
            $(this).addClass("on").siblings().removeClass("on");
            $(".linBoxListContent dl").eq(i).show().siblings().hide();
        });
    });
});
</script>
</head>
<body>
<div id="linTab">

<div class="linListTab">
        <ul>
            <li class="on"><a href="javascript:void(0)">第一</a></li>
            <li><a href="javascript:void(0)">第二</a></li>
            <li><a href="javascript:void(0)">第三</a></li>
        </ul>
        <br class="clearBoth" />
    </div>

<div class="linBoxListContent">
        <dl>
            <dd>1111</dd>
        </dl>

<dl class="none">
            <dd>2222</dd>
        </dl>

<dl class="none">
            <dd>3333</dd>
        </dl>    
    </div>

</div>
</body>
</html>

jquery tab mouseover 特效的更多相关文章

  1. js,jquery,css,html5特效

    包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...

  2. jquery tab

    jquery tab <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:// ...

  3. jquery tab选项卡、轮播图、无缝滚动

    最近做一个页写了一个星期,觉得自己对jquery还是很不熟悉 自己查了一下资料写了几个封装好的tab选项卡.轮播图.无缝滚动 $(function(){ //tab选项卡 jQuery.tab=fun ...

  4. jQuery Tab选项卡切换代码

    jQuery Tab选项卡切换代码是一款简单的jquery tab选项卡切换网页特效代码样式,可以修改tab选项卡相关样式. 代码下载:http://www.huiyi8.com/sc/10863.h ...

  5. 强大的自适应jQuery焦点图特效

    jQuery焦点图切换自适应效果 自适应jQuery焦点图特效是一款支持移动端的响应式jQuery焦点图插件,支持flexible布局,支持移动触摸事件等. 今天我们要来分享一款很灵活的jQuery焦 ...

  6. 给大家分享一个jQuery TAB插件演示

    jquery tab选项卡插件示例页面代码,使用jquery.tabs.js轻量级的tab选项卡插件来实现,并支持鼠标滑过.点击.自动切换.数据回调等功能,有的是点击切换,有的是鼠标滑过切换,自带了多 ...

  7. 简单的jquery tab

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jquery tab 插件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 分享jquery实现百叶窗特效的图片轮播

    首先非常感谢网友嘉翼的无私分享,这是他刚在网站扣下来的特效,第一时间与大家分享,jquery实现百叶窗特效的图片轮播 使用方法: 1.引用css文件,css文件里面已经做了注释,基本只需要修改宽高就好 ...

随机推荐

  1. 通过Response.Flush()实现IE下载失败的问题

    通过Response.Flush()实现对服务端文件的下载时,会失败,不能正常弹出IE下载框,经过测试发现需要进行如下设置后即可解决. 进入 [工具]--->[Internet选项]---> ...

  2. PAT 1075. PAT Judge (25)

    题目地址:http://pat.zju.edu.cn/contests/pat-a-practise/1075 此题主要考察细节的处理,和对于题目要求的正确理解,另外就是相同的总分相同的排名的处理一定 ...

  3. windows下把Apache加入系统服务

    始 --- 运行,输入cmd,再打开一个命令提示符.分别输入如下命令(每行回车) cd到Apache24\binhttpd.exe-k install-n"servicename" ...

  4. 什么是Cocos2d-x

    以下是官方对Cocos2d-x的说明."       Cocos2d-x is an open-source mobile 2D game framework, released under ...

  5. leecode 每日解题思路 127-Factorial Trailing Zeroes

    原题描述: 原题地址: Factorial Trailing Zeroes 题目描述很直接, 给出一个整数N, 求这个N的阶乘后尾有几个零.(要求O(logN)时间复杂度) 个人思路: 一开始,最简单 ...

  6. java窗体与Flash交互

    最近在研究flash,用flash去读取文件很简单,但是存储文件就很麻烦了. 因此想到用java的窗体进行交互. 下面是DJNativeSwing-SWT-1-0-3-20140708的下载链接: h ...

  7. R-大数据分析挖掘（5-R基础回顾）

    (一)R函数 R是一种解析型语言,输入后可直接获取结果 函数(输入参数,参数) R的函数分为“高级”和“低级函数” • 高级函数可调用低级函数 • 高级函数称为泛型函数 • 函数名  <-­‐ ...

  8. 定时执行Timer

    JAVA import java.awt.event.*; import java.io.BufferedWriter;import java.io.File;import java.io.FileO ...

  9. 【JAVA错误笔记】 - 【Could not open ServletContext resource [/WEB-INF/applicationContext.xml]解决方法】

    错误描述: Could not open ServletContext resource [/WEB-INF/applicationContext.xml] 原因分析: 问题主要由于加载spring的 ...

  10. 使用solr搭建你的全文检索

    Solr 是一个可供企业使用的.基于 Lucene 的开箱即用的搜索服务器.对Lucene不熟?那么建议先看看下面两篇文档: 实战Lucene,第 1 部分: 初识 Lucene:http://www ...