1. <style type="text/css">
  2. .hi {
  3.     width: 200px;
  4.     height: 18vw;
  5.     background-color: pink;
  6. 	font-weight: bold;
  7. 	font-size: 24px;
  8. 	overflow: hidden;
  9. }
  10. button {
  11. 	border: 1px solid red;
  12. 	padding: 10px;
  13. 	margin: 10px 0 0 66px;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18. <div class="hi">
  19. 	<p>hello world1!</p>
  20. 	<p>hello world2!</p>
  21. 	<p>hello world3!</p>
  22. 	<p>hello world4!</p>
  23. 	<p>hello world5!</p>
  24. 	<p>hello world6!</p>
  25. 	<p>hello world7!</p>
  26. </div>
  27. <button>more</button>
  28.  
  29. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
  30. <script type="text/javascript">
  31. 	$('button').click(function() {
  32. 		var obj=$('.hi').height();
  33. 		if(obj=='180'){
  34. 			$('.hi').height('auto');
  35. 		} else {
  36. 			$('.hi').height('180px');
  37. 		}
  38.  
  39. 	});
  40. </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. python中用json存储列表字典等文件操作

    JSON字符串用json.dumps, json.loads JSON文件名用json.dump, json.load 由于需要在脚本重启后依旧能够记住之前所使用的列表内容, 故采用json存储列表文 ...

  2. type 命令

    type 显示属于那种类型

  3. 深入理解JVM之类加载

    ---title: [学习]深入理解JVM之类加载.mddate: 2019-10-20 22:20:06tags: JVM 类加载--- Java类的加载,连接,初始化都是在程序运行期间执行的 ## ...

  4. mysql之sql优化

    sql的执行顺序: 先看下下面两条多表关联sql,第1条查询到1条记录,第2条查无记录: on 筛选条件在笛卡尔积之前,where筛选条件在笛卡尔积之后执行 先执行from, join的话,左连接,左 ...

  5. vue elment.style样式修改（第三方组件自生成元素）

    参考:https://blog.csdn.net/dcxia89/article/details/80402490         https://blog.csdn.net/jianglibo102 ...

  6. 从0开始学习ssh之日志工具与配置log4j

    添加slf4j-api-1.6.1,slf4j-log4j12-1.6.1,log4j-1.2.15三个jar包到lib文件夹下就可以使用log4j日志文件.具体配置在log4j.properties ...

  7. 2019-9-11-完整的-P2P-应用需要包含哪些功能

    title author date CreateTime categories 完整的 P2P 应用需要包含哪些功能 lindexi 2019-9-11 9:0:55 +0800 2019-09-05 ...

  8. [转]Visual Studio 2010单元测试（2）－－运行测试并查看代码覆盖率

    Visual Studio 2010 单元测试--运行测试并查看代码覆盖率 运行测试并查看代码覆盖率对程序集中的代码运行测试时,可以通过收集代码覆盖率数据来查看正在测试的项目代码部分. 运行测试并查看 ...

  9. Django项目：CRM(客户关系管理系统)--81--71PerfectCRM实现CRM项目首页

    {#portal.html#} {## ————————46PerfectCRM实现登陆后页面才能访问————————#} {#{% extends 'king_admin/table_index.h ...

  10. JavaSE_03_Thread类02

    1.1 线程状态概述 当线程被创建并启动以后,它既不是一启动就进入了执行状态,也不是一直处于执行状态.在线程的生命周期中, 有几种状态呢?在API中 java.lang.Thread.State 这个 ...