按需加載字體

我的應用程序必須支持許多字體。用戶可以從給定的字體列表中選擇任何字體。同步或異步加載所有字體是沒有意義的，因爲用戶可能會使用許多字體中的一種字體，而只是浪費帶寬。按需加載字體

我有一個帶有字體名稱的選擇框，我想在用戶從選擇框中選擇字體時加載字體。

使用typekit我可以在單獨的工具包中分割字體，但是如何在javascript事件中加載這些工具包？

我可以使用typekit，google字體或任何其他服務來實現此目的嗎？

2015-06-30 Anil Maurya

這很簡單。你只需要用JavaScript注入相應的CSS規則。如果您在外部CSS文件中具有字體 - 面部定義，則只需將<link>標籤動態添加到HTML頭部即可。這當然可以是直接來自Google Fonts或TypeKit的CSS文件。

var link = document.createElement("link") 
link.setAttribute("rel", "stylesheet") 
link.setAttribute("type", "text/css") 
link.setAttribute("href", "http://fonts.googleapis.com/css?family=Indie+Flower") 
document.getElementsByTagName("head")[0].appendChild(link)

來源

2015-06-30 18:21:20 udondan

謝謝@udondan，雖然我還沒有使用過你的解決方案，甚至嘗試過，但我想我會在將來使用它，它會工作。 –

有趣的問題 - 我只是環顧GIT，遇到了一個WebFont加載器JS，看起來可能會解決您的問題。這是相當有據可查的，可能會提供一個很好的解決方案看到這裏：https://github.com/typekit/webfontloader

來源

2015-06-30 18:02:27 adamo

已經看着它，沒有幫助。 –

按需加載字體

回答

相關問題