Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Как сделать на сайте выбор шрифта пользователем и динамическое изменение введенного т (https://javascript.ru/forum/events/45083-kak-sdelat-na-sajjte-vybor-shrifta-polzovatelem-i-dinamicheskoe-izmenenie-vvedennogo-t.html)

angelzzz 13.02.2014 17:27

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

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

Спасибо!

danik.js 13.02.2014 21:01

<!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>

danik.js 13.02.2014 21:02

Возможно есть более удобный способ, через js-лоадер гугла какой-нибудь.

kostyanet 16.02.2014 22:23

Задача сложнее. Автор желает поменять фонт выделенному куску текста, то есть вижуфиг ему нужен.

danik.js 17.02.2014 04:59

Цитата:

Сообщение от kostyanet
Автор желает поменять фонт выделенному куску текста

Экстрасенс что-ли? О-о, отлично, у нас тут таких не хватает ))


Часовой пояс GMT +3, время: 02:50.