用Javascript更改我网站上的字体大小

Change font size on my website with Javascript

本文关键字：字体 网站 Javascript      更新时间：2023-09-26

这是我的网站http://natjecanje.interes.hr/

我想要大A和小A，通过按下其中一个"A"，人们可以更改网站上所有字母的大小，所有元素都需要更改字体大小，谢谢！：）

附言：我在谷歌上搜索了一下，但没有找到我要找的东西。

您需要使用两种不同的CCS样式，一个小的JS脚本

请在下面找到Javascript：

function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
if (navigator.appName == "Microsoft Internet Explorer") {
window.resizeBy(0,-10);
window.resizeBy(0,+10);
}
}
function getActiveStyleSheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
  }
  return null;
}
function getPreferredStyleSheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1
       && a.getAttribute("rel").indexOf("alt") == -1
       && a.getAttribute("title")
       ) return a.getAttribute("title");
  }
  return null;
}
function createCookie(name,value,days) {
  if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
  }
  else expires = "";
  document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}
window.onload = function(e) {
  var cookie = readCookie("style");
  var title = cookie ? cookie : getPreferredStyleSheet();
  setActiveStyleSheet(title);
}
window.onunload = function(e) {
  var title = getActiveStyleSheet();
  createCookie("style", title, 365);
}
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);

您可以将此脚本保存在名为：changement_css.js 的文件中

现在，您需要第一个具有常规字体大小的CCS样式，以及另一个具有不同字体大小的样式，并将其包含在HTML文件中。

<!--Default CSS-->
<link rel="stylesheet" type="text/css" href="normal.css" title="normal">
<!--Alternate CSS-->
<link rel="alternate stylesheet" type="text/css" href="grand.css" title="grand">

复制那些行而不是常规CSS然后，使用以下代码在CSS链接后调用JS：

<script language="JavaScript" src="changement_css.js" type="text/javascript"></script>

然后，您需要一个按钮来更改字体大小：

<ul>
<li><a href="#" onclick="setActiveStyleSheet('normal'); return false;">Normal</a></li>
<li><a href="#" onclick="setActiveStyleSheet('grand'); return false;">Grand</a></li>
</ul>

我希望这能对你有所帮助。

此消息翻译自：http://forum.alsacreations.com/topic-6-11551-1-Boutons-AugmenterDiminuer-la-Taille-du-Texte-.html

function promjenaVelicineFonta(inc) 
{ 
var p = document.getElementsByTagName('p'); 
for(n=0; n<p.length; n++) { 
if(p[n].style.fontSize) { 
var size = parseInt(p[n].style.fontSize.replace("px", "")); 
} else { 
var size = 14; 
} 
p[n].style.fontSize = size+inc + 'px'; 
} 
var span = document.getElementsByTagName('span'); 
for(n=0; n<span.length; n++) { 
if(span[n].style.fontSize) { 
var size = parseInt(span[n].style.fontSize.replace("px", "")); 
} else { 
var size = 14; 
} 
span[n].style.fontSize = size+inc + 'px'; 
} 
}

我找到了一个解决方案，就在这里。

您的意思是字体大小（如10pt、12pt等）还是字体大写（如a或a）？我认为你的意思是基于你问题的主题的资本化（因为你说的是"大"answers"小"）？

您可以通过"text transform"属性使用CSS控制大写(http://www.w3schools.com/cssref/pr_text_text-transform.asp)。

您可以使用JavaScript添加或删除CSS类，这在本线程中概述：更改元素'；带有JavaScript 的s类

使用这种方法，您可以添加删除CSS类，这些类使用文本转换来更改字体的大小写。

相关文章：