Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.02.2014, 18:27
Интересующийся
Отправить личное сообщение для angelzzz Посмотреть профиль Найти все сообщения от angelzzz
 
Регистрация: 20.12.2011
Сообщений: 29

Как сделать на сайте выбор шрифта пользователем и динамическое изменение введенного т
Привет!

Как сделать для пользователя сайта возможность выбора шрифта из списка (выпадающий список/чекбокс), и мгновенного изменения шрифта для уже введенного текста. Шрифты из google fonts.

Спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 13.02.2014, 22:01
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    </head>
    <body>
        <select id="font">
            <option selected value="">Default</option>
            <option>Marck Script</option>
            <option>Seymour One</option>
        </select>
        <div id="sample">
            Как сделать для пользователя сайта возможность выбора шрифта из списка (выпадающий список/чекбокс), и мгновенного изменения шрифта для уже введенного текста. Шрифты из google fonts. 
        </div>
        <script>
        (function(){
            var url = "http://fonts.googleapis.com/css?family={family}&subset=latin,cyrillic";
            var link = document.createElement('link');
            link.rel = 'stylesheet';
            document.getElementsByTagName('head')[0].appendChild(link);
            var font = document.getElementById('font');
            var sample = document.getElementById('sample');
            font.onchange = function() {
                var family = this.value;
                if (family) {
                    link.href = url.replace('{family}', encodeURIComponent(family));
                }
                sample.style.fontFamily = family;
            };
        })()
        </script>
    </body>
</html>
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #3 (permalink)  
Старый 13.02.2014, 22:02
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Возможно есть более удобный способ, через js-лоадер гугла какой-нибудь.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #4 (permalink)  
Старый 16.02.2014, 23:23
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

Задача сложнее. Автор желает поменять фонт выделенному куску текста, то есть вижуфиг ему нужен.
Ответить с цитированием
  #5 (permalink)  
Старый 17.02.2014, 05:59
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от kostyanet
Автор желает поменять фонт выделенному куску текста
Экстрасенс что-ли? О-о, отлично, у нас тут таких не хватает ))
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать своё онлайн радио на сайте? Gvozdb Библиотеки/Тулкиты/Фреймворки 0 17.05.2013 08:27
Как сделать что бы при регистрации человека на моем сайте у него не появлялось... drunkwolfs Общие вопросы Javascript 2 07.08.2012 10:58
Как сделать плавный переход к элементу на сайте ? dimaan777 jQuery 2 03.05.2011 17:45
Нужно сделать плавное появление текстового поля как на сайте vkontakte.ru paratrooper1981 Элементы интерфейса 1 23.11.2009 18:24
Как сделать электронный каталог продукции? natarius Серверные языки и технологии 6 24.05.2009 20:56