jquery实现隐藏,简化和更多
HTML代码:
<div class="box">
<div class="header">
<h3>图书分类</h3>
<span><img src="data:images/11_03.gif" height="20" width="20" alt="" /></span>
</div>
<div class="content">
<ul>
<li><a href="#">小说(1110)</a></li>
<li><a href="#">文艺(230)</a></li>
<li><a href="#">青春(1430)</a></li>
<li><a href="#">少儿(1560)</a></li>
<li><a href="#">生活(870)</a></li>
<li><a href="#">社科(1460)</a></li>
<li><a href="#">管理(1450)</a></li>
<li><a href="#">计算机(1780)</a></li>
<li><a href="#">教育(930)</a></li>
<li><a href="#">工具书(3450)</a></li>
<li><a href="#">引进版(980)</a></li>
<li><a href="#">其它类(3230)</a></li>
</ul>
<div class="bot">
<a href="#">简化</a>
</div>
</div>
</div>
jQuery代码:
$(".header").click(function() {
if($(".content").is(":visible")){
$(".header span img").attr("src","images/11_05.gif");
$(".content").css("display","none");
}else
{
$(".header span img").attr("src","images/11_03.gif");
$(".content").css("display","block");
}
})
$(".content .bot > a").click(function() {
if($(".content .bot > a").text()=="简化")
{
$("li :gt(4) :not(:last)").hide();
$(".bot>a").text("更多");
}else{
$("li :gt(4) :not(:last)").show();
$(".bot>a").text("简化");
}
})
jquery实现隐藏,简化和更多的更多相关文章
- Unity 游戏框架搭建 2019 (十八~二十) 概率函数 & GameObject 显示、隐藏简化 & 第二章 小结与快速复习
在笔者刚做项目的时候,遇到了一个需求.第一个项目是一个跑酷游戏,而跑酷游戏是需要一条一条跑道拼接成的.每个跑道的长度是固定的,而怪物的出现位置也是在跑道上固定好的.那么怪物出现的概率决定一部分关卡的难 ...
- jQuery获取隐藏文本域
[html] view plaincopyprint?//jquery获取隐藏域 <style type="text/css"> div{ width:1 ...
- jQuery 效果 —— 隐藏和显示
jQuery 效果 -- 隐藏和显示 1.隐藏和显示 (1)在jQuery中我们可以使用hide()和show()分别隐藏和显示HTML元素: //隐藏元素 $("button") ...
- jQuery上拉加载更多
<header id="header">首 页</header> <section id="main"> <ul id ...
- JQuery效果隐藏/显示
hide() 方法 语法 $(selector).hide(speed,callback) show() 方法 语法 $(selector).show(speed,callback) 参数 描述 sp ...
- JQuery中隐藏/显示事件函数
1.$("button").click(function(){ $("p").hide(); });2.如果您的网站包含许多页面,并且您希望您的 jQuery ...
- jquery中隐藏div的几种方法
//jQuery中的显示.隐藏方法 $("#id").show()://表示display:block, $("#id").hide()://表示disp ...
- jQuery 效果 - 隐藏和显示
$('...').hide();//隐藏 $('...').show();//显示 以上使用需要针对特定的功能单独使用,如果是混用,那么就要有标志位去实现,而通常两者更高级的一步到位实现: $('.. ...
- jquery显示隐藏toggle
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- EF – 3.EF数据查询基础(下)数据关联
5.5.1 <关于“数据关联”,你不一定清楚的事> 这讲视频比较全面地介绍了“一对一”.“一对多”和“多对多”三种数据关联类型在关系数据库和Entity Framework数据模型中的实现 ...
- Shell编程基础教程1--Shell简介
1.Shell简介 1.1.查看你系统shell信息 cat /etc/shell 命令可以获取Linux系统里面有多少种shell程序 echo $SHELL 命令可以查看当前你所使用的shell是 ...
- 【ubuntu 】常见错误--Could not get lock /var/lib/dpkg/lock
ubuntu 常见错误--Could not get lock /var/lib/dpkg/lock 通过终端安装程序sudo apt-get install xxx时出错: E: Could not ...
- HDU2296 Ring(AC自动机 DP)
dp[i][j]表示行走i步到达j的最大值,dps[i][j]表示对应的串 状态转移方程如下: dp[i][chi[j][k]] = min(dp[i - 1][j] + sum[chi[j][k]] ...
- jquery中ajax的简单使用
一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...
- MathType 常用快捷键
MathType 数学公式编辑器是广大理科生电脑上必不可少的软件!然而在大量公式时,不会巧妙使用快捷键真的是心累身累.巧妙使用MathType数学公式编辑器可加快数学符号的录入速度和效率,这将节约大量 ...
- linux 操作mysql
MySQL删除数据库时的错误 ERROR 1010 (HY000): Error dropping database (can't rmdir './myapp', errno: 39)的错误信息. ...
- 封装自己的printf函数
#include <stdio.h> #include <stdarg.h> //方式一 #define DBG_PRINT (printf("%s:%u %s:%s ...
- Shadow SSDT详解、WinDbg查看Shadow SSDT
一.获取ShadowSSDT 好吧,我们已经在R3获取SSDT的原始地址及SDT.SST.KiServiceTbale的关系里面提到:所有的SST都保存在系统服务描述表(SDT)中.系统中一共有两个S ...
- 自己yy的Splay
#include <iostream> #include <cstdio> #include <queue> using namespace std; ; stru ...