Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 13.03.2018, 17:23   #1
spoon100500
Форумчанин
 
Аватар для spoon100500
 
Регистрация: 14.10.2016
Сообщений: 406
По умолчанию Зависимость font-size от ширины контейнера

День добрый, подскажите пожалуйста, есть плагин на qj который меняет font-size текста от ширины контейнера или body
Код:
(function($) {
   $.fn.flowtype = function(options) {
      var settings = $.extend({
         maximum   : 9999,
         minimum   : 1,
         maxFont   : 9999,
         minFont   : 1,
         fontRatio : 35
      }, options),
 
      changes = function(el) {
         var $el = $(el),
            elw = $el.width(),
            width = elw > settings.maximum ? settings.maximum : elw < settings.minimum ? settings.minimum : elw,
            fontBase = width / settings.fontRatio,
            fontSize = fontBase > settings.maxFont ? settings.maxFont : fontBase < settings.minFont ? settings.minFont : fontBase;
         $el.css('font-size', fontSize + 'px');
      };
 
      return this.each(function() {
      // Context for resize callback
         var that = this;
      // Make changes upon resize
         $(window).resize(function(){changes(that);});
      // Set changes on load
         changes(this);
      });
   };
}(jQuery));
Всё вроде круто но возникла проблема, он меняет font-size шрифта от ширины контейнера равной 100%, т.е. когда контейнер имеет ширину в %, а у меня контейнер ширину в px. Что дописать или исправить в плагине, чтобы он менял font-size не только при ширине контейнера в % но и в px?
И еще вопрос, у меня ширина контейнера меняется на точках (медиа), т.е. на дефолте контейнер имеет например width: 400px;, на @media (max-width:45em) width: 300px;, media (max-width:35em) width: 200px;
Как прописать эту зависимость и нужно ли её вообще прописывать?
Еду медленно, но верно!
spoon100500 вне форума Ответить с цитированием
Старый 13.03.2018, 23:43   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

Математика css-шлюзов, не думал, что мне эта статья вообще понадобится, ибо считал ее очевидностью на уровне ниже начинающего. Но, пришлось промотать 6 страниц ленты, чтоб ее найти. Изучай.
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 14.03.2018, 08:06   #3
spoon100500
Форумчанин
 
Аватар для spoon100500
 
Регистрация: 14.10.2016
Сообщений: 406
По умолчанию

Думаю то самое, спасибо большое.
Еду медленно, но верно!
spoon100500 вне форума Ответить с цитированием
Старый 14.03.2018, 11:56   #4
spoon100500
Форумчанин
 
Аватар для spoon100500
 
Регистрация: 14.10.2016
Сообщений: 406
По умолчанию

Вроде всё ни чиго, но как ни крути тут зависимость от ширины экрана, а мне нужно от ширины контейнера т.е. изменили ширину в медиазапросе изменился font-size шрифта. В чем тут фишка то, ширина контейнера может и не меняться на точках, оставаться такой же как и на дефолной, а шрифт в этой ситуации будет уменьшаться это не правильно, вот и нужно что бы шрифт менялся от ширины контейнера в медиазапросах.

Вот и нужна зависимость от ширины контейнера, я думаю тут только скрипт поможет, силами css наврядли.
Как пример: раз нам нужна зависимость от ширины контейнера то мы устанавливаем два значения шрифта-min и max, где max=дефолтной ширине контейнера, а min=минимальной ширине контейнера.
Например: ширина блока на дефолте=400px, шрифт=24px, если ширина измениться до 200px (не важно где-на медиа или дефолтной странице) то шрифт =16px, но понятное дело с плавным изменением, не сразу перескакивать с 24 на 16px.
Еду медленно, но верно!

Последний раз редактировалось spoon100500; 14.03.2018 в 12:07.
spoon100500 вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
zip архив у которого Compressed size и Uncompressed size 0xFFFF dmitriegorovih Общие вопросы Delphi 22 20.01.2015 23:33
Ошибка: String[1]: the Size property has an invalid size of 0. mrChester Базы данных (ADO.NET, LinqToSql, ORM Entity Framework, NHibernate) 1 18.01.2012 20:06
[SIZE="4"]Найти максимальное число y Delphi[/SIZE] Артем1904 Помощь студентам 5 16.12.2011 10:22
Резиновый font-size, Как сделать резионвый font-size в блоке? AlienNation HTML и CSS 0 26.09.2011 09:14
font.size in label RealSHELS Общие вопросы Delphi 4 31.01.2009 00:09