ilyachase
@ilyachase
web-developer

С помощью какого инструмента создаются сайты через canvas?

Подскажите, пожалуйста, с помощью какого инструмента (программы, редактора) создаются сайты, где структура, например, текста такая:
<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>

То есть практически везде используется canvas. Кто-нибудь знает такой редактор?
  • Вопрос задан
  • 3400 просмотров
Решения вопроса 1
Это не редактор. Вывод того что Вы приложили делает простой Cufon - библиотека по отрисовке на js шрифтов на канвасе, которые Вы не смогли подключить через web fonts, либо через font-face.

Суть такова, вы берет файл фонта, который хотите использовать, идете на cufon.shoqolate.com/generate загружаете свой фонт в принимаемом Cufon`ом формате (ttf, otf, остальное надо уточнять), он на основе Вашего файла генерирует js файл, который и рисует на канвасе буковки Вашего фонта. Потом скачиваете этот файл, скачиваете файл cufon-yui.js, включаете в свою страницу сначала cufon-yui.js, потом файл с отрисовкой Вашего фонта который скачали, пишете в своем основном js файле для всего проекта, пару правил вида
Cufon.now();
Cufon.replace('h1', { fontFamily: 'font-famyly-с-вашего скрипта' });
Cufon.replace('h2', { fontFamily: 'font-famyly-с-вашего скрипта' })


И получаете отрисовку h1, h2 тем шрифтом, который Вы прогнали через Cufon. Причем эта отрисовка в html, после работы скрипта, будет выглядеть именно так, как тот кусок кода, что Вы опубликовали в вопросе.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@IoannGrozny
Front-end разработчик
Cufon - это JS библиотека, для кроссбраузерной подстановки кастомных шрифтов на сайт. Но именно из-за канвас, данный путь ущербен. Текст нельзя будет выделить, и скопировать(технически, он вообще будет картинкой). Кроме того, для того, чтоб этот метод работал, необходимо преобразовать шрифт в тяжеловесную JS библиотеку.
Но, если всё это вас не пугает, то вот: Cufon.
Соответственно, статья на хабре: Cufón – используйте шрифты, какие душа пожелает
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы