<div class="toggle">
<p id="zi">收起</p>
<p id="zhe"><img src="data:images/up.png" width="20"/></p>
</div>

$(function() {
$('.toggle').click(function() {
$('.headerwrap').slideToggle(function() {
var res = $(this).is(':visible');
if (res) {
$("#zi").text("收起");
$('#zhe').html("<img src='images/up.png' width='20'/>");
} else {
$("#zi").text("展开");
$('#zhe').html("<img src='images/down.png' width='20'/>");
}

});
});
})

控制div显示隐藏(有文字图片介绍)的更多相关文章

  1. js 控制div 显示隐藏的问题

    var divs = document.getElementsByTagName("div");得到所有的divfor(var i=0;i<divs.length;i++){ ...

  2. 多个div独立控制其显示/隐藏

    今天要说一个神奇的html标签op,静态页下可以配合jquery分别控制每个层的显示/隐藏切换. 如果用动态中使用,用文章id做区分就可以了. <html> <head> &l ...

  3. css控制div显示/隐藏方法及2种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  4. js控制div显示与隐藏

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

  5. angular学习笔记(八)-控制视图显示隐藏

    本篇介绍angular控制视图的显示和隐藏: 通过给元素添加ng-show属性或者ng-hide属性来控制视图的显示或隐藏: ng-show: 绑定的数据值为true时,显示元素,值为false时,隐 ...

  6. 利用div显示隐藏实现的分页效果

    实现步骤: 1.创建对应切换div <div class="bottom_daohang"> <div class="bottom_daohang_zo ...

  7. 通过select下拉框里的value控制div显示与隐藏

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

  8. JQuery 控制元素显示隐藏

    JS在浏览器里面做调试的时候,先在浏览器里面找到页面代码加上断点来执行.然后根据执行情况来查找部分变量是否能找到,一点一点的排查内容.可以做筛选条件 部分隐藏.默认让部分条件加上.hide 默认隐藏, ...

  9. 单选,复选操作div,显示隐藏

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

随机推荐

  1. Android中的安全与访问权限控制

    Android是一个多进程系统,在这个系统中,应用程序(或者系统的部分)会在自己的进程中运行.系统和应用之间的安全性是通过Linux的facilities(工具,功能)在进程级别来强制实现的,比如会给 ...

  2. [Cubieboard] Node.js 在 Lubuntu 上安装指南

    在 Ubuntu 下安装 Node.js sudo apt-get install python-software-properties python g++ make sudo add-apt-re ...

  3. [OSX] 在 OS X 中安装 MacPorts 指南

    什么是MacPorts? MacPorts是使用于Mac OS中第三方包管理工具. MacPorts让你可以轻松编译.安装和管理开源软件.MacPorts可以分为两个核心部分:MacPort base ...

  4. 如何构建日均千万PV Web站点(二) 之~缓存为王~

    随着网站业务的不断发展,用户的规模越来越大:介于中国无比蹩脚复杂的网路环境:南电信:北联通:中间竟然只用一条链路进行互联通信!有研究表明,网站访问延迟和用户流失率正相关,网站访问速度越慢,用户越容易失 ...

  5. Apache Kafka 0.11版本新功能简介

    Apache Kafka近日推出0.11版本.这是一个里程碑式的大版本,特别是Kafka从这个版本开始支持“exactly-once”语义(下称EOS, exactly-once semantics) ...

  6. (iOS)使用auto layout进行复杂布局时,UILabel的相关trick

    本文转载至 http://blog.csdn.net/madongchunqiu/article/details/47960745  本文首发于CSDN:http://blog.csdn.net/ma ...

  7. 多了解一下Chrome开发者控制台

    多了解一下Chrome开发者控制台 2017年10月14日 • Tools, Web前端 • 1.0k views • 暂无评论 作为一名前端开发者,Chrome内置的控制台是必须了解的,它拥有非常丰 ...

  8. LeetCode 34 Search for a Range (有序数组中查找给定数字的起止下标)

    题目链接: https://leetcode.com/problems/search-for-a-range/?tab=Description   Problem: 在已知递减排序的数组中,查找到给定 ...

  9. 【黑金原创教程】【FPGA那些事儿-驱动篇I 】实验十九:SDRAM模块② — 多字读写

    实验十九:SDRAM模块② — 多字读写 表示19.1 Mode Register的内容. Mode Register A12 A11 A10 A9 A8 A7 A6 A5 A4 A3 A2 A1 A ...

  10. 【咸鱼教程】DragonBones帧动画、骨骼json、极速、二进制

    公司的人想用龙骨,但是同事在官网找不着二进制的资料...于是写了个简单demo. demo中包含了帧动画.骨骼动画json.极速和二进制的资源和代码 测试环境:DragonBonesPro 5.5  ...