Dynamicznie ładuj czcionki Google po wczytaniu strony

Question

Chciałbym mieć możliwość wybrania przez użytkownika czcionki, w której strona ma być wyświetlana. Here to sposób, w jaki Google zaleca korzystanie z JavaScript.

WebFontConfig = { 
    google: { 
     families: ['Tangerine', 'Cantarell'] 
    } 
}; 

(function() { 
     var wf = document.createElement('script'); 
     wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + 
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js'; 
     wf.type = 'text/javascript'; 
     wf.async = 'true'; 
     var s = document.getElementsByTagName('script')[0]; 
     s.parentNode.insertBefore(wf, s); 
     })(); 

Jak mogę to zmienić, aby móc ponownie pobrać czcionki po załadowaniu strony?

Answer 1

Zapoznaj się z polecenia WebFont.load w tym github repo:

https://github.com/typekit/webfontloader

można załadować czcionki cokolwiek chcesz dynamicznie:

<script src="http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script> 
    <script> 
     WebFont.load({ 
        google: { 
          families: ['Droid Sans', 'Droid Serif'] 
        } 
     }); 
    </script>