Answer the question
In order to leave comments, you need to log in
What tool is used to create websites through canvas?
Tell me, please, with the help of what tool (program, editor) are sites created, where the structure, for example, of the text is as follows:
<cufon class="cufon cufon-canvas" alt="Школа " style="width: 95px; height: 33px;">
<canvas width="114" height="37" style="width: 114px; height: 37px; top: -5px; left: 0px;"></canvas>
<cufontext>Школа </cufontext>
</cufon>
<cufon class="cufon cufon-canvas" alt="Боевых " style="width: 106px; height: 33px;">
<canvas width="125" height="37" style="width: 125px; height: 37px; top: -5px; left: 0px;"></canvas>
<cufontext>Боевых </cufontext>
</cufon>
<cufon class="cufon cufon-canvas" alt="Искусств " style="width: 125px; height: 33px;">
<canvas width="145" height="37" style="width: 145px; height: 37px; top: -5px; left: 0px;"></canvas>
<cufontext>Искусств </cufontext>
</cufon>
Answer the question
In order to leave comments, you need to log in
This is not an editor. The output of what you have attached is done by a simple Cufon - a library for rendering js fonts on canvas that you could not connect via web fonts or via font-face.
The bottom line is, you take the font file that you want to use, go to cufon.shoqolate.com/generate, upload your font in the format accepted by Cufon (ttf, otf, the rest must be specified), it generates a js file based on your file, which and draws letters of your font on the canvas. Then download this file, download the cufon-yui.js file, first include cufon-yui.js in your page, then the file with rendering of your font that you downloaded, write in your main js file for the entire project, a couple of rules like
Cufon.now();
Cufon.replace('h1', { fontFamily: 'font-famyly-с-вашего скрипта' });
Cufon.replace('h2', { fontFamily: 'font-famyly-с-вашего скрипта' })
Cufon is a JS library for cross-browser substitution of custom fonts on the site. But precisely because of the canvas, this path is flawed. The text cannot be selected and copied (technically, it will generally be a picture). In addition, in order for this method to work, you need to convert the font to a heavyweight JS library.
But, if all this does not scare you, then here: Cufon .
Accordingly, the article on Habré: Cufón - use the fonts that your heart desires
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question