当前位置: 动力学知识库 > 问答 > 编程问答 >

Change font size on my website with Javascript

问题描述:

This is my website http://natjecanje.interes.hr/

I want to have big A and small A and by pressing one of this "A" people can change all letters size on website, all elements need change font size, Thank you! :)

P.S. I did google search, but i didn't find what i was looking for.

网友答案:

You need to use 2 differents CCS Style, a little JS script

Please Find below 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);
网友答案:
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'; 
} 
}

I found a solution, here it is.

网友答案:

Do you mean font size (i.e. 10pt, 12pt etc) or font capitalisation (i.e. a or A)? I think you mean capitalisation based on the theme of your question (because you said 'big' and 'small')?

You can control capitalisation with CSS via the 'text-transform' property (http://www.w3schools.com/cssref/pr_text_text-transform.asp).

You can use JavaScript to add remove CSS classes which is outlined in this thread: Change an element's CSS class with JavaScript

Using this approach you could add remove CSS classes which use text-transform to change the capitalisation of the font.

分享给朋友:
您可能感兴趣的文章:
随机阅读: