Переключатель размера шрифта сайта на jQuery
Те мои постоянные читатели, кто заходят на блог, наверняка уже заметили, что его контентная часть несколько преобразилась: во-первых, фиксированная ширина этого блока изменена на динамическую (кстати, на эту тему скоро будет написан пост с целью выявления красивого решения), во-вторых, над сайдбаром появилась фича "Размер шрифта", ...
Комментарии (40)
Вот тут реализация удобнее, ИМХО. Когда кнопки +/-, то понятнее. И ещё, опять же ИМХО, переключатель расположен далековато от текста.
В Опере не работает, так что и говорить не о чем.
У меня Opera 9.60 (Win) — всё работает нормально.
У меня тоже Opera 9.60 (Win). При клике на +/- загружается главная страница сайта.
Скрипт это конечно здорово, на если бы верстал грамотно в em-ах, то смог бы сделать и без скрипта… да кстати, ссылки в списках, это зачёт, ещё бы не забывал если про микроформаты, и сделал в емах … цены тебе не было бы, а так обычный верстальщик, без изюминок …)))
@jeenart тут все умные, не только ты ;) а решение на jQuery хорошее, можно еще добавить понятности — представить в виде букв разного размера, пропорции конечно не важны, гл-е видеть динамику.
А почему бы не воспользоваться стандартным масшатбированием шрифта в браузере? Потому что увеличивается все шрифт, а нужно только контента?
Ney,
У меня тоже нормально работает 9.60 (10 447) Win Vista
Когда заходишь первый раз, то не показывает какой размер шрифта выбран.
2jeenart:
Через EM не получится так, как было нужно мне. Тем более, что EM — это морока. Не люблю их.
2Повелитель тегов:
Пробовал сначала сделать буквами — вышло некрасиво, поэтому сделал квадратами.
2Zodios:
Во-первых, да. Во-вторых, все браузеры по-своему реализуют масштабирование.
Yuriy Drozdov, потому что используется размер по умолчанию и ничего не выбрано.
jeenart, пфф, где это сказано, что «грамотно верстать» — это только в em-ах?
Ув. Марина, это сказано в здравом смысле, объясню почему: пользователи IE не смогут увеличить размер шрифта указанного в px, а таких пользователей ещё очень и очень много и про них не стоит забывать, если конечно вы верстаете не для того чтобы полюбоваться им в лисе3 и не забить на то как оно смотрится в других браузерах или скажем если зайти с мобилки, а также для того чтобы сделать увлечения шрифта как например на этом сайте, если указывать размер шрифта в em-ах, то можно сделать подобную функцию стандартными средствами css, и не нужно будет использовать скрипты.
Верстать нужно в em и всё будет нормально. Тогда и с ie не будет проблем.
Наконец-то. Спасибо :)
Максим, а в процентах можно?
Я бы добавил title к переключателям. Не уверен, нужно ли там указывать конкретный размер, или нет.
И изначальное значение всё-таки стоит показать. Иначе не понятно, что это переключатель, который может что-то переключать. Нелогично.
По поводу em и % видел недавно статью… Из неё явным образом следует, что они не равноценны и проценты таки правильнее.
может грубо выскажуся, но эти копошения со шрифтами такой снобизм и перфекционизм…
Михаил, спасибо за разумные предложения. Изменил.
У меня тоже Opera 9.60 (Win). При клике на +/- загружается главная страница сайта.
Я понимаю, что этот блог читают только гуру CSS и скриптов, но есть и чайники вроде меня, которые не понимают как это установить. Можно хоть в нескольких словах описать, как устанавливать?
Всё я понял. Только вот как сделать, чтобы при уменьшении/увеличении шрифта он оставался одинаковым в сайдбаре,т. е. так как на этом блоге. Ато я сделал и у меня меняется размер полностью всего шрифта на блоге.
Допустим, что у контента идентификатор
id="content"
, а у сайдбараid="sidebar"
. Чтобы не затронуть сайдбар нужно использовать такую конструкцию:При этом имей в виду, что блоки с контентом и сайдбаром должны быть сами по себе,т. е. не находиться друг в друге.
Попробовал прописать вот так в style. css
body.style1 #content { font: 13px/18px «Trebuchet MS», Tahoma, Arial, sans-serif; }
не помогло (сори если вопросы нубские)
У меня в index. php:
Это значит что сайдбар внутри какогото дива. Я правильно понимаю?
Чтото код не отобразился.
У меня в index. php
Это значит что сайдбар внутри какогото дива. Я правильно понимаю?
Блин ну чего он не отображается: «»
А подсказки по добавлению кода для кого написаны? =)
Сори :)
Попробовал прописать вот так в style. css
body.style1 #content { font: 13px/18px «Trebuchet MS», Tahoma, Arial, sans-serif; }
не помогло (сори если вопросы нубские)
У меня в index. php:
Это значит что сайдбар внутри какогото дива. Я правильно понимаю?
Сброшу код на мыло