Controlling Font Size With Javascript 兼容主流浏览器

<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Controlling Font Size With Javascript 兼容主流浏览器</title>
<meta name="author" content="Geovin Du 涂聚文"/>
<script type="text/javascript">
var min=8;
var max=18;
function increaseFontSize() {

   var p = document.getElementsByTagName('div'); //
   //var p=document.getElementById("geovindu");//
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 12;
      }
      if(s!=max) {

         s += 1;
      }
      p[i].style.fontSize = s+"px"

   }
}
function decreaseFontSize() {
   var p = document.getElementsByTagName('div'); //
   //var p=document.getElementById("geovindu");//
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 12;
      }
      if(s!=min) {

         s -= 1;
      }
      p[i].style.fontSize = s+"px"

   }
}
</script>
</head>

<body>
<a href="javascript:decreaseFontSize();">-</a>
<a href="javascript:increaseFontSize();">+</a>
<div id="geovindu">

塗脂抹粉 FDKSAJ gesdfs Geovin Du 塗聚文 涂斯博 涂聚文 涂家村 捷为工作室 缔友计算机信息技术有限公司
</div>
</body>

</html>
时间: 2024-09-30 07:03:44

Controlling Font Size With Javascript 兼容主流浏览器的相关文章

User select font-face/color/size/backgroundColor设置 字体,颜色,大小,背景色兼容主流浏览器

<!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> <meta content="text/html;

Bootstrap编写一个兼容主流浏览器的受众门户式风格页面_javascript技巧

上一次写的<Bootstrap编写一个兼容主流浏览器的受众巨幕式风格页面>(点击打开链接)部分老一辈的需求可能对这种后现代的风格并不满意,没关系,我们完全可以改变布局拉成门户式的风格,他们马上就接受了:  首先,门户式的布局的大概你要清楚,这一才利于我们快速布局开头是一个较小的巨幕,后是一个导航栏,这里还是用到了按钮组接着是各个专栏,这里是关于bootstrap栅格系统与面板的运用,最后是版权信息,这里还是一个面板. 反正个人觉得这种门户式的布局风格烂大街,但不知道为何似乎很受众的样子. 我们

兼容主流浏览器的iframe自适应高度js脚本

 兼容主流浏览器的 iframe 自适应高度,很实用的,具体的js脚本如下,感兴趣的朋友可不要错过  兼容主流浏览器的 Iframe 自适应高度,js脚本如下:   代码如下: //iframe 高度自适应  function iframeAutoFit(iframeObj) {  setTimeout(function () {  if (!iframeObj) return;  iframeObj.height = (iframeObj.Document ? iframeObj.Docume

兼容主流浏览器的iframe自适应高度js脚本_javascript技巧

兼容主流浏览器的 Iframe 自适应高度,js脚本如下: 复制代码 代码如下: //iframe 高度自适应 function iframeAutoFit(iframeObj) { setTimeout(function () { if (!iframeObj) return; iframeObj.height = (iframeObj.Document ? iframeObj.Document.body.scrollHeight : iframeObj.contentDocument.bod

CSS网页制作技巧:兼容主流浏览器的背景颜色透明

文章简介:CSS网页制作技巧:兼容主流浏览器的背景颜色透明. 以前都是用jquery来写背景透明,方法简单,但是有缺点,脚本没加载完时,背景颜色是不透明的.如果换成在css里写好的话,效果就很好了..transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } 上面的几个属性分别是: opacity: 0.5; 这是最重要的,因为它是CSS标准.该属性支持f

js代码实现的加入收藏效果并兼容主流浏览器_javascript技巧

//加入收藏 function AddFavorite(){ if (document.all) { addToBookMark(window.location.href, document.title); } else if (window.sidebar) { addToBookMark(document.title, window.location.href); } } function addToBookMark(url,title){ var ua = navigator.userAg

javascript 兼容所有浏览器的DOM扩展功能_javascript技巧

今天周五,很闲,坐在电脑前没什么事可做,产品线的人也没提什么新的需求,可能下周会有新的需求和工作安排,但那是下周的事了.今天就想写点技术的东西,也就当作是记记笔记,本人水平有限,希望大家多多指教,嘴下留情,哈哈. 有时候我们会想扩展DOM元素的功能,可以添加一些自定义的方法,以让它用起来更加灵活.方便:先来举个例子: 复制代码 代码如下: <!DOCTYPE html><html lang="zh"> <head>  <title>DOM

js读取XML数据兼容主流浏览器

例1  代码如下 复制代码 <script type="text/javascript"> function loadXML(xmlFile) {      var xmlDoc; if (window.ActiveXObject){//兼容IE浏览器 xmlDoc = new ActiveXObject('Msxml2.DOMDocument'); xmlDoc.async=false;;//关闭异步加载,如许可确保在文档完整加载之前,解析器不会继续执行剧本 xmlDoc

javascript 兼容所有浏览器 打开对话框的解决方案

用javascript成员访问特性实现通用版的兼容所有浏览器的打开对话框功能 打开网页对话框,一般有三种方法:window.open.window.showModalDialog.window.showModelessDialog,每一种都有它的优点与不足.第一种方法:window.open是大家常用的方法,它兼容所有的浏览器,打开一个新网页窗口很简单,但这种方法打开的"对话框"它默认的情况下是不支持交互(比如:获得返回值)与挂起操作(即:打开后若没有关闭,则其它网页窗口均无法操作,处