0

I want to change the font size of a number that is assigned to a variable and then printed out.

var secondsPerMinute = 60;
var minsPerHour = 60;

var hoursPerDay = 24;
var daysPerWeek = 7;
var weeksPerYear = 52;
var secondsPerDay =  secondsPerMinute*minsPerHour*hoursPerDay;
document.write(secondsPerDay);
var alpha = "blah";
document.write(alpha.fontsize(10));

Here I want to change the font size of the output secondsPerDay .. for some reason .fontsize() does not work on it. I am new to javascript so apologies if this seems like a foolish question.

gagan mahatma
  • 325
  • 2
  • 9
  • Does the line document.write(alpha.fontsize(10)); change the size of that output? If so, why aren't you doing the same thing when you output secondsPerDay? – Theresa Jan 10 '16 at 13:24
  • i did try it, but for some reason it only seems to work on strings – sahil sanwal Jan 10 '16 at 13:36

3 Answers3

3

According to the MDN page on String#fontsize:

Deprecated
This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

Nor should you use document.write, for many reasons.

Write output into HTML elements defined on your page, styled using CSS. For example:

<span id="secondsPerDay" style="font-size: 10px; "></span>
document.getElementById('secondsPerDay').textContent = secondsPerDay;
Community
  • 1
  • 1
1

change the last line to

document.write("<span style='font-size:10px;'>"+secondsPerDay+"</span>");
document.write("<span style='font-size:10px;'>"+alpha+"</span>");

use font-size property of the css

after checking @torazaburo's answer, try to use innerHTML rather than document.write

document.body.innerHTML += "<span style='font-size:10px;'>"+secondsPerDay+"</span>";
document.body.innerHTML += "<span style='font-size:10px;'>"+alpha+"</span>";
gurvinder372
  • 61,170
  • 7
  • 61
  • 75
  • sorry if i could not mention the question clearly.. i want to change font size of the variable- secondsPerDay , not alpha. however thanks for taking out the time – sahil sanwal Jan 10 '16 at 13:25
  • @sahilsanwal sure, check the update. However Nick-Zuber's answer looks fine – gurvinder372 Jan 10 '16 at 13:27
0

EDIT:

The fontsize function is a deprecated method from the String object and you should avoid using it. See some of the other solutions people have posted as a safer alternative.

I recommend outputting HTML and setting the font-size using inline CSS:

document.write('<span style="font-size: 10px">' + secondsPerDay + '</span>');
                             ^^^^^^^^^^^^^^^

Updated fiddle


You have to also apply fontsize() to the secondsPerDay:

document.write(secondsPerDay.toString().fontsize(10));

See your working code here.

Nick Zuber
  • 4,769
  • 2
  • 19
  • 45
  • thanks a lot that did work.. but is there possibly a way that i could change the font size without converting it to string. – sahil sanwal Jan 10 '16 at 13:32
  • @sahilsanwal Unfortunately there isn't because `fontsize` is a method of the `String` object. However, you could just keep two versions of the variable - string and number – Nick Zuber Jan 10 '16 at 13:37