View Full Version : html5 increasing font size in a simple step?

12-01-2012, 05:54 PM
I want to increase the font size of items on my shopping list temporarily when I click on them.
So I want

var shoppingitem, fontsize=10;

if clickedon==True {

context.fillText(shoppingitem,10, shoppingitemnum*20);

Problem is increasing font size seems to require a context.font = "big long string detailing font and font size in px"

Is there a way to increment font size integer without having to turn it all into a concateated string and send it to context.font =


Philip M
12-02-2012, 11:10 AM
Change the className of the <span> or <p> onclick to a new class with a different font size/color/whatever.
If you want to revert to the original size on a second click, you need to count the clicks odd/even.
You may be looking for onmouseover rather than onclick.

Djokovic won against the background of his current father's illness. - Commentator Radio 4

12-02-2012, 07:36 PM
Try this

<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<style type="text/css">
span:hover {font-size: medium;}
#pagecontent {font-size: small;}
<div id="pagecontent">
<span>Test</span><br />
<span>Test1</span><br />
<span>Test2</span><br />
<span>Test3</span><br />

12-02-2012, 08:30 PM
That is a neat solution Jane, thank you

but I want to do it in javascript on a canvas
I really havent got the hang of this CSS stuff so was hoping to avoid it

I got stuck with the <div> command early on so switched to javascript for everything but the canvas.text command takes a string rather than a number to set the size