<style type="text/css">

.hi {

    width: 200px;

    height: 18vw;

    background-color: pink;

	font-weight: bold;

	font-size: 24px;

	overflow: hidden;

}

button {

	border: 1px solid red;

	padding: 10px;

	margin: 10px 0 0 66px;

}

</style>

</head>

<body>

<div class="hi">

	<p>hello world1!</p>

	<p>hello world2!</p>

	<p>hello world3!</p>

	<p>hello world4!</p>

	<p>hello world5!</p>

	<p>hello world6!</p>

	<p>hello world7!</p>

</div>

<button>more</button>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

	$('button').click(function() {

		var obj=$('.hi').height();

		if(obj=='180'){

			$('.hi').height('auto');

		} else {

			$('.hi').height('180px');

		}

	});

</script>

　　

jQ-点击查看更多的更多相关文章

  1. 利用ScrollView滑动属性实现点击查看更多

    利用ScrollView的滚动实现点击查看更多 效果图 更新内容布局 <ScrollView android:id="@+id/sv_des" android:layout_ ...

  2. JS点击查看更多内容 控制段落文字展开折叠

    JavaScript+jQuery实现的文字展开折叠效果,点击文字后文字内容会完整的显示出来,控制段落来显示文字,不需要的时候,可以再次点击后将内容折叠起来,也就是隐藏了一部分内容.点击查看更多的功能 ...

  3. jquery 点击查看更多箭头变化，文字变化,超出带滚动条。

    从网上好了好久,没找到自己要的,自己写了一下. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  4. angular点击查看更多（简单demo）

    今天来跟大家分享一个小的demo,一般网页浏览到底部的时候会有一个点击加载更多的按钮,之前一直纠结怎么写这个,今天学习angular时发现可以用组件来实现这么一个小的效果,大家有兴趣的话可以看一下. ...

  5. iOS中"查看更多/收起"功能实现

    实现效果如图: 查看更多功能在很多app种都有应用,在这里简单的实现,介绍实现流程: 一个tableViewCell中包含一个collectionView,"查看更多"按钮是tab ...

  6. jquery 点击显示更多

    点击显示更多 html <div class="servicepicture banxin"> <div class="imgcontent" ...

  7. 微信小程序——收起和查看更多功能

    项目中做一些列表的时候,可能会需要做到 查看更多 及 收起功能,如下图所示: 大概的需求就是默认只显示2条,点击[查看更多]显示全部,点击[收起]还原. 实现的方法千万种.我来讲一下我的实现思路: 1 ...

  8. Vue:列表展开和收起（超过一定行数时显示‘查看更多’按钮）

    前言:前端小白记录的一些小功能~ 公司开发中的小程序中有做任务签到的功能,这就涉及到了任务列表以及对任务列表的展开和收起功能,好了可以开始了,说多了就烦了 1.首先是css样式,因为设计稿上是超过两行 ...

  9. 用自定义getElementByClassName函数做“查看更多”的特效

    <!DOCTYPE html> <html> <head> <title>查看更多</title> <meta charset=&qu ...

随机推荐

  1. IDEA将代码推送至远程GitHub仓库

    1 在项目根路径下添加.gitignore文件 2 创建本地git仓库 3 git add操作 快捷键 ctrl+alt+a 4 git commit操作 快捷键ctrl+k 5 git push操作 ...

  2. 廖雪峰Java13网络编程-2Email编程-1发送email

    1.邮件发送 1.1传统邮件发送: 传统的邮件是通过邮局投递,从一个邮局到另一个邮局,最终到达用户的邮箱. 1.2电子邮件发送: 与传统邮件类似,它是从用户电脑的邮件软件(如outlook)发送到邮件 ...

  3. HNOI2018

    d1t1[HNOI/AHOI2018]寻宝游戏 感觉很神,反正我完全没想到 分开考虑每一位,对于每一位i计算一个二进制数b[i], 对于第i位,从后往前第j个数这一位是1,那么b[i]^=(1< ...

  4. Codeforces Round #599 (Div. 2)的简单题题解

    难题不会啊…… 我感觉写这个的原因就是因为……无聊要给大家翻译题面 A. Maximum Square 简单题意: 有$n$条长为$a_i$,宽为1的木板,现在你可以随便抽几个拼在一起,然后你要从这一 ...

  5. Excel常用函数总结

    Excel常用函数总结 2016-10-28 Kevin 叼着奶瓶撩妹 1. VLOOKUP函数 常见形式 问题描述:将下图中G列的数据根据学生的姓名填充到D列. 公式解析: =VLOOKUP(A2, ...

  6. VS2010-MFC（对话框：创建对话框类和添加控件变量）

    转自:http://www.jizhuomi.com/software/153.html 前两讲中讲解了如何创建对话框资源.创建好对话框资源后要做的就是生成对话框类了.生成对话框类主要包括新建对话框类 ...

  7. VS2010-MFC（MFC消息映射机制概述）

    转自:http://www.jizhuomi.com/software/147.html 前面已经说过,Windows应用程序是消息驱动的.在MFC软件开发中,界面操作或者线程之间通信都会经常用到消息 ...

  8. WhaleCTF之隐写-Find

    WhaleCTF之隐写-Find 前往题目 图片保存到本地,用Stegsolve打开图片 找到二维码 用微信或qq扫描,得到flag~

  9. Python学习day11-函数基础(1)

    figure:last-child { margin-bottom: 0.5rem; } #write ol, #write ul { position: relative; } img { max- ...

  10. [转]Visual Studio 2010单元测试（3）－－顺序单元测试

    之前我们做的测试都是一个一个进行的,当然我们也可以一次性选择多个测试方法进行,但是测试运行的顺序以“测试列表编辑器”窗口中的默认列表顺序为准.在实际场景中,我们需要进行有顺序的单元测试,步骤可能每一步 ...