<div id="outer">
<ul id="tab">
<li class="current">tab标签</li>
<li>qq在线客服代码</li>
<li>css3</li>
</ul>
<div id="content">
<ul style="display:block;">
<a href="http://www.lanrenzhijia.com/tab">tab标签</a>
</ul>
<ul>
<a href="http://www.lanrenzhijia.com/service">qq在线客服代码</a>
</ul>
<ul>
<a href="http://www.lanrenzhijia.com/js/css3">css3</a>
</ul>
</div>
</div>
<!-- html代码end --> <script src="http://www.lanrenzhijia.com/ajaxjs/jquery.min.js"></script>
<script>
$(function(){
window.onload = function()
{
var $li = $('#tab li');
var $ul = $('#content ul'); $li.mouseover(function(){
var $this = $(this);
var $t = $this.index();
$li.removeClass();
$this.addClass('current');
$ul.css('display','none');
$ul.eq($t).css('display','block');
})
}
});
</script>

jq tab的更多相关文章

  1. jq TAB切换

    <a href="http://www.w3.org/1999/xhtml">" target="_blank">http://ww ...

  2. js或者jq的tab切换

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  3. jQuery实现简单的tab切换

    html: <section>   <nav id="nav">     <a class="on">tab1</a& ...

  4. easyui源码翻译1.32--Tabs(选项卡)

    前言 使用$.fn.tabs.defaults重写默认值对象.下载该插件翻译源码 选项卡显示一批面板.但在同一个时间只会显示一个面板.每个选项卡面板都有头标题和一些小的按钮工具菜单,包括关闭按钮和其他 ...

  5. Visual Studio插件【一】:前端

    JQuery Code Snippets https://github.com/kspearrin/Visual-Studio-jQuery-Code-Snippets 简单用法 jq   +tab ...

  6. jq 版的tab切换

    ta切换是在前端中非常常见的一种效果,网上的效果很多.但是我觉得下面这种方法最好,把tab效果封装成一个函数 tabs,这个函数要配合jq使用. var tabs = function (tab, c ...

  7. jq的选项卡tab

    jq中选项卡很简单,的注意是他结构命名(网上有很多,其中不乏不规范) 1.tab 2.tab-hd (选项栏) 3.tab-bd(选项栏对应的内容) css代码(布局没问题,可以只看jquery代码) ...

  8. jq封装的tab切换

    function tab(a,b,c){ $(a).on(c,function(){ $(this).addClass('active').siblings().removeClass('active ...

  9. tab选项卡--jq

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. phpcms如何使用推荐位调用自定义字段

    默认phpcms是无法使用推荐位调用自定义字段的 一般自定义字段默认添加在附表里(也可以添加在主表里),调用自定义字段时 加上moreinfo="1" 直接写{pc:content ...

  2. android模拟器使用PC串口调试

    android模拟器使用PC串口调试1.模拟器可以使用PC的串口  启动模拟器并加载PC串口 命令如下:  运行 emulator @模拟器名称 -qemu -serial COM12.查看串口是否被 ...

  3. 让/etc/profile文件修改后立即生效(转)

    方法1:让/etc/profile文件修改后立即生效 ,可以使用如下命令:# .  /etc/profile注意: . 和 /etc/profile 有空格方法2:让/etc/profile文件修改后 ...

  4. AxureRP7.0教学大纲Tutorial directory

    参考: http://www.axurerp.cn/learn/2014/0812/5.html Axure RP7.0标准教程 http://bbs.yuanxingku.com/thread-5- ...

  5. Codeforces Round #360 (Div. 2) E. The Values You Can Make DP

    E. The Values You Can Make     Pari wants to buy an expensive chocolate from Arya. She has n coins, ...

  6. sql复制表、拷贝表、临时表

    --insert into pppcopy select * from ppp //从表ppp中获取数据,并将其插入到pppcopy中,只拷贝表的数据,不拷贝表的结构(前提:表pppcopy1存在) ...

  7. SplendidCRM 如何添加及使用中文语言包

    SplendidCRM 功能很强大,也支持多国语言,但关于中文语言安装的介绍在网上一直都找到,自已摸索了一下,成功使SplendidCRM应用中文,以下是安装方法. 版本号:SplendidCRM 7 ...

  8. python 代码片段12

    #coding=utf-8 d={'title':'python web development','year':2008} print d.setdefault('pub','addision we ...

  9. BZOJ3790 : 神奇项链

    Manacher求出所有极长回文子串后,得到一堆线段,转化成线段覆盖问题 预处理出g[i]表示左端点不超过i的右端点的最大值 贪心地线段覆盖即可 时间复杂度$O(n)$ #include<cst ...

  10. CSS:权重和层叠规则决定了其优先级

    首先,给大家看一篇关于CSS优先级的示例:http://www.ido321.com/76.html 一.基本的优先级规则 比较同一级别的个数,数量多的优先级高,如果相同即比较下一级别的个数,至于各级 ...