0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 2248 Просмотров
*

beliyadm

  • Легенда
  • 9758
  • 1664 / 66
  • Севастополь, Россия
Читал на днях статью разработчика  kremlin.ru и нашел там интересную фишку
Цитировать
Адаптивные заголовки. Размер шрифта изменяется в зависимости от размера заголовка, чтобы оставаться в нашей сетке.
Пример http://tinyurl.com/gvdrrn2 http://kremlin.ru/multimedia/video

Суть: есть блок заголовка фиксированной высоты, текст может быть разный, одно слово или много - они изменяют размер шрифта в зависимости от его количества, чтобы вписывался в блок.
Судя по коду они к H2 добавляют класс smaller. На уровне JS я не нашел такого хака, значит делают на уровень выше.
Никто с таким не сталкивался? Интересна реализация

Считают количество букв (заранее зная, что этим шрифтом влазит в строку столько-то) и если больше уменьшают? Или как-то по другому?
« Последнее редактирование: 04.09.2016, 13:27:24 от beliyadm »
Все истины, которые я хочу вам изложить, — бесстыдная ложь. Сделать всё хорошо
TLG: @Beliyadm
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
ну пример какой-то скучный и да - не на JS, по ходу, т.к. динамическое добавление текста ничего не меняет.
фактически имеем пару php строк с условием
если_не_мобильная, то
если длинна текста > n, добавить класс
*

beliyadm

  • Легенда
  • 9758
  • 1664 / 66
  • Севастополь, Россия

если длинна текста > n, добавить класс
Ну я так и подумал, кто-нибудь применял подобное? Есть ли смысл в данном хаке? Мне кажется удобное решение для выстраивание сетки, если каждый блок фикс по высоте.
Все истины, которые я хочу вам изложить, — бесстыдная ложь. Сделать всё хорошо
TLG: @Beliyadm
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
ну для блога или для модуля чего бы не написать?
но, имхо, интереснее сделать универсальное и на js.

а вообще, думаю, интересная альтернатива выравниванию блоков по высоте, которая обычно применяется, чтобы сетку сдеражать
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
кстати, реализуется легко даже силами одного чайника )).
сравниваем высоту контейнера (фиксированная) и высоту дочернего блока (плавающая) и дописываем класс.
https://jsfiddle.net/effrit/2m8s6ebg/4/
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Расположение текста

Автор ast

Ответов: 4
Просмотров: 1828
Последний ответ 17.06.2020, 16:45:26
от ast
Размер шрифта в iframe

Автор AlexB

Ответов: 6
Просмотров: 1331
Последний ответ 10.03.2020, 16:07:44
от AlexB
Перенос текста, направление текста в списке?

Автор warlocksp

Ответов: 1
Просмотров: 975
Последний ответ 15.07.2019, 21:51:54
от warlocksp
Проблема шрифта bold

Автор web3.0

Ответов: 3
Просмотров: 2145
Последний ответ 06.04.2019, 09:50:36
от web3.0
Слайдер текста на CSS

Автор Stasweb

Ответов: 0
Просмотров: 909
Последний ответ 04.04.2019, 07:24:03
от Stasweb