<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. LoadRunner内部结构（2）

    LoadRunner内部结构(2) 接着(1)的内容: 17.默认的LRReport文件夹创建在本地分析机器的My Documents文件夹下来存储分析会话文件. 18.可以使用HTML格式 19.格 ...

  2. 廖雪峰Java12maven基础-1maven入门-1maven介绍

    1.Java项目: * 1.1.首先确定引入哪些依赖包,如commons-logging, log4j, selenium * 1.2.确定项目的目录结构 * 1.3.配置环境:如JDK的版本号 * ...

  3. 廖雪峰Java12maven基础-1maven入门-2依赖管理

    maven 如果我们的项目依赖第三方的jar包: Commons Logging发布的jar包在那里下载? 使用Log4j需要哪些jar包 其他依赖:junit,Javamail,MySQL驱动... ...

  4. 自己编写jquery插件

    http://blog.csdn.net/chenxi1025/article/details/52222327 https://www.cnblogs.com/ajianbeyourself/p/5 ...

  5. Linux RHEL7（CentOS7源) 安装 Nginx

    安装步骤 1.添加 Nginx 源地址 CentOS7 默认没有提供 Nginx 的源,但 Nginx 自己提供了 sudo rpm -Uvh http://nginx.org/packages/ce ...

  6. python基础-re正则

    一:什么是正则? 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法.或者说:正则就是用来描述一类事物的规则. (在Python中)它内嵌在Python中,并通过 ...

  7. Luogu P4782 【模板】2-SAT 问题(2-SAT)

    P4782 [模板]2-SAT 问题 题意 题目背景 \(2-SAT\)问题模板 题目描述 有\(n\)个布尔变量\(x_1\sim x_n\),另有\(m\)个需要满足的条件,每个条件的形式都是&q ...

  8. DataSourceUtils（使用C3P0连接池的工具类）

    一.导入jar包(c3p0-0.9.1.2.jar) 2.添加配置文件(放在src下) 配置文件的名称:c3p0.properties 或者 c3p0-config.xml 放在src之下 c3p0. ...

  9. leyou_03_cors解决ajax的跨域请求问题

    1.为什么会有跨域问题 因为跨域问题是浏览器对于ajax请求的一种安全限制:一个页面发起的ajax请求,只能是与当前页域名相同的路径,这能有效的阻止跨站攻击. 因此:跨域问题 是针对ajax的一种限制 ...

  10. supports-screensandroid

    最近在做一个开发者入门的专题,因此一直在搜索关于入门开发的知识和资料,希望能够给开始学习Android开发的朋友提供指导性参考.今天找到了一篇不错的技术文章. 语法: <supports-scr ...