jQ-点击查看更多

<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>

  

时间: 2024-12-31 09:38:42

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

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

从网上好了好久,没找到自己要的,自己写了一下. <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>more_up_arrows</title> <style type="text/css"> .w1000{width:1000px;margin:0 auto;} .mgt10{margin-top:10px;}

折叠多余文本内容,点击查看更多

command:设定规定的行数,当文本内容超过时,折叠并有一个“查看更多”的按钮 step1:编写html...... <p statue="0" class="text close_text"> //status是自定义的属性,“0”是false,“1”为True texttexttextvvshjhhsbcnxgfggggkshjahcjbkjciwhiuheohbcjkbcnzlkxkjidjoieklkxm.,cxzmkcowdjijdpoweo

“查看更多”--和--“点击收起”(模拟开关事件)

原理: 1.首先定义一个开关(其实就是一个标志),默认为开: 2.定义或者获取默认显示的容器(container)的高度(heightm): 3.点击按钮(#more-news-media)时,如果为"开(true)",则容器(container)的高设为自动(auto),就将显示所有,此时将开关置为"关",将按钮上的文字设为"点击收起":如果为"关(false)",则容器的高设为第二步中"定义或获取"的高

jquery 点击显示更多

点击显示更多 html <div class="servicepicture banxin"> <div class="imgcontent"> <div class="img"> <img src="/uploads/image/20190411/d5ec13bdf0fcb9eaa8cf265d94fe6035.png" /> </div> <div clas

iOS点击查看大图的动画效果

对于图片来说,除了表情包,几乎都会被点击查看大图.今天就讲解一个查看和收起大图的动画效果,先直接看效果图: 如图所示,最开始是一个小图,点击小图可以查看大图.大图会从小图的位置和大小"弹"出来,同时背景变成半透明的阴影.点击大图或者阴影后,收起大图,同样地弹回到小图去,同时去掉阴影背景,就像是一张图片在伸大缩小一样. 现在看看这是怎么实现的.在思考一个动画的实现方法时,把动画的动作进行分解然后再一个个去思考怎么实现是一个好的习惯,我们稍微分解一下,这个动画在显示大图和收起大图的时候做了

css3模拟jq点击事件

还是这个梗,收好冷.今天是一个css3模拟jq点击事件,因为我发现,css3中没有类似于,js的点击事件,那么,可不可以仿照 jq的效果,类似的做一个呢?主要用到,input里面的radio 单选按钮,然后后面跟一个a标签,让radio覆盖在a上,那为什么不直接 把 a放在radio上面呢?因为选择器 + 好选择嘛,用radio的功能,a来修饰按钮样式,再把radio 隐藏,这里要用opacity(透明度) 这就是,主要原理! 上视图吧 <!DOCTYPE html> <html>

jQuery-点击查看联系方式

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>其他事件one</t

JQ点击高亮显示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <styl

jquery 点击查看,收起特效

<div class="all"> <p><a href="javascript:;" id="onvk">点击查看</a></p> <div class="tedg" style="background: gainsboro; height: 300px;"> </div> </div> <style&g