javascript实现控制文字大中小显示

 　　javascript实现控制文字大中小显示

          网页上可以自由改变字体大小是个非常有助于用户体验的小功能，现在许多网站上都有此功能，今天我们来简单实现下。

　　部分网站内容页通常会看到有控制文字分别以 大，中，小 三种方式显示，下面就把这个小功能做一下记录，对提高网站用户体验度还是有一些帮助的哦!

　　?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js控制文字大中小显示</title>
</head>
<body>
<script language="javascript">
function setFontSize(objID,size){
document.getElementById(objID).style.fontSize=size+'px';
}
</script>
<div id="content">
<p>数据库(主要是MySQL和Access数据库),javascript,jquery,div+css,html,windows系统,linux系统以及健康养生方面的学习笔记和生活经验积累!</p>
</div>
<a onclick="setFontSize('content',20)">大</a>
<a onclick="setFontSize('content',14)">中</a>
<a onclick="setFontSize('content',12)">小</a>
</body>
</html>

　　以上所述就是本文的全部内容了，希望大家能够喜欢。

时间： 2025-01-30 11:36:03

javascript实现控制文字大中小显示的相关文章

javascript实现控制文字大中小显示_javascript技巧

部分网站内容页通常会看到有控制文字分别以 大,中,小 三种方式显示,下面就把这个小功能做一下记录,对提高网站用户体验度还是有一些帮助的哦! <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js控制文字大中小显示</title> </head> <body&g

js控制文字大中小显示代码

js控制文字大中小显示  代码如下 复制代码 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js控制文字大中小显示</title> </head> <body> <script language="javascript"&g

CSS控制文字的显示与隐藏引出的BUG

css|控制|显示 这一段CSS代码相当简单,目的就是想用CSS来控制某段文字的显示与隐藏.起初我采用了下面的代码,令人不可思议的是,它们在我的IE6.0上居然没有任何反应,大家不信可以亲自试验一下. <style type="text/css">a {font-size:12px;text-decoration:none;height:50;}a:hover {text-decoration:none;}a span {font-size:12px;display:non

CSS控制 如何让12px以下的文字正常显示

css|控制|显示 在网页中如何让大小为12px以下的文字正常显示可以有很多方式,例如 NT 系统支持这样的: 11px 运行代码框 <style by tesion.>p{font: 11px tahoma}</style><p>tahoma font style, size 11px. 中文字体 </p>   [Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行] 中文运行代码框 <style by tesion.>p{font: 1

使用JavaScript脚本控制网页Table的显示隐藏

javascript|脚本|控制|网页|显示 [需求]如果大家登录过我傲:http://www.woall.com新浪博客等就会发现可以点击栏目标题,就会发现栏目可以展开和收起,非常好用!其实这个功能实现起来很简单.重点就是要找到要隐藏的Table行,对它的display属性进行控制. 强烈建议大家登录:http://www.woall.com亲身体验一下! [另]网址怎么加链接啊??? [源码]使用方法:把文件考下来,保存为htm类型的文件即可! <!DOCTYPE html PUBLIC &qu

javascript实现点击后变换按钮显示文字的方法

  本文实例讲述了javascript实现点击后变换按钮显示文字的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 <html xmlns="http://www.w3.org/1999/xhtml"> <head>

javascript在一个function里控制loading的显示与隐藏

问题描述 代码如下,不知为何无法执行出loading显示后又隐藏的效果.<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>javascript在一个function里控制loading的显示与隐藏</title><script type="text/javascrip

javascript实现点击后变换按钮显示文字的方法_javascript技巧

本文实例讲述了javascript实现点击后变换按钮显示文字的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>显示一些按钮,如果点击了, 当前点击的按钮文本变为"点了",其他按钮文本变为"没点"</title> <script type="text/javascript

javascript文字滚动显示实现代码

1.html  代码如下 复制代码 <div class="box" id="marqueebox0"> <ul> <li style="background:#f8e2ac;">第一行</li> <li style="background:#f5f5f5;">第二行</li> <li style="background:#ffe6ec;&