Просмотр полной версии : скрипт изменения шрифта по размеру окна - какой он?
greenwar
08.09.2014, 23:58
приветствую
сам скрипт довольно прост:
var fs;
width=screen.width;
if(width >= 2450){fs = '30px'} // mac 2500
else if(width >= 2000){fs = '26px'} // unknown
else if(width >= 1650){fs = '22px'} // 1920x1080
else if(width >= 1550){fs = '20px'} // 1600x900
else if(width >= 1050){fs = '16px'} // nb 1370
else if(width <= 1050){fs = '14px'} // 1024x768
else if(width <= 820){fs = '12px'} // 800x600
document.body.style.fontSize = fs;
его можно завернуть в функцию и вызывать через body onload
но тогда изменение шрифтов на странице будет происходить с задержкой
надо вызывать прям из head через writeln что-то типа:
<script>document.writeln('<style>body{font-size:'+fs+'}</style>')</script>
но так не работает
fs не видится
можно всю функцию распечатать в head, но хотелось бы отдельным файлом
как правильно сделать?
greenwar
09.09.2014, 00:06
как вообще сделать, чтобы в файле отрабатывался какой-то код по вызову из шапки?
не функция, а код без функции
хоть alert
если просто прописать <script src=file></script>, он не работает
Какие проблемы? Всё работает если всё в head запихнуть.
greenwar
09.09.2014, 02:02
я не хочу в head тупо листинг вываливать
<script src="file"></script> также прекрасно работает.
greenwar
09.09.2014, 02:41
что именно работает, как меняете шрифт?
http://learn.javascript.ru/play/z3shic
Но вообще пора бы переходить на http://htmlbook.ru/css/value/media .
krasovsky
09.09.2014, 08:04
Ну во первых - зачем такое извращение? Почему просто не определить в css несколько классов с нужными параметрами и устанавливать их в зависимости от размера экрана, а обязательно фаршировать html как утку??
А вообще, нормальные люди для такого используют media queries css.
greenwar
09.09.2014, 10:17
http://learn.javascript.ru/play/z3shic
Но вообще пора бы переходить на http://htmlbook.ru/css/value/media .
сеньк ю вери мач
а почему надо заворачивать в скобки всю функцию, почему без скобок то не работает?
а что медия, там вроде как опять же надо прописывать все варианты
какая разница то? при этом медиа относительно новая и работает, начиная с IE 9
greenwar
09.09.2014, 10:18
Ну во первых - зачем такое извращение? Почему просто не определить в css несколько классов с нужными параметрами и устанавливать их в зависимости от размера экрана, а обязательно фаршировать html как утку??
потому что там 1 класс - body
krasovsky
09.09.2014, 10:31
потому что там 1 класс - body
Где там? <body></body> Это не класс а dom элемент. Которому можно навесить N-е количество классов, и один id. <body id="myId" class="class1 class2">. Написав в отдельном css файле (или прямо в html нахреначить как в 90х) несколько классов с помощью js можно навешивать их dom элементам.
а почему надо заворачивать в скобки всю функцию, почему без скобок то не работает?В функцию заворачивать не обязательно (http://learn.javascript.ru/play/K9wSe), но так принято делать, дабы не забивать глобальную область видимости лишними переменными.
Если же не понятна конструкция (function(){}()) - это создание функции сразу же вызов её. Об этом много написано, используйте гугл или поиск по форуму.
greenwar
09.09.2014, 14:11
Где там? <body></body> Это не класс а dom элемент. Которому можно навесить N-е количество классов, и один id. <body id="myId" class="class1 class2">. Написав в отдельном css файле (или прямо в html нахреначить как в 90х) несколько классов с помощью js можно навешивать их dom элементам.
ну и зачем создавать несколько классов, а потом подставлять нужное название в body, когда можно сразу подставить нужный размер:
body{font-size:16px}
по-моему второе проще - классы не надо создавать хотя бы
greenwar
09.09.2014, 14:11
Если же не понятна конструкция (function(){}()) - это создание функции сразу же вызов её.
не знал про неё, спс, у меня поэтому и не запускалось
Pavel M.
09.09.2014, 20:14
можно также в css использовать vw, vh, vmin, vmax http://learn.javascript.ru/play/hnVL
Pavel M., крутотень. С этого вообще надо было начинать делать веб. Пискелей вообще, имхо, быть не должно было изначально. Это трагическая ошибка из-за которой мы имеем то, что имеем.
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot