Geek Answers Handbook

Which font should be used for the latest Unicode characters?

Note: they are not new. Just “not supported,” anyway.

I am trying to make simple controls for an element on my website, according to a simple “no sound” or “no sound” control.
However, I haven't been able to find any fonts capable of handling the newer Unicode symbols, such as the speaker symbols ( 🔇to 🔊, or 🔇to 🔊) which are broken (🔇 🔈 🔉 🔊) even on Stack Overflow, yet still - They can be found in the Unicode character listings and are somehow able to be displayed in my PDF reader and Internet Explorer, but not Chrome.

This is the first paragraph (above), from my point of view, with broken characters: Definitely not working.

Anyway, here is my code snippet. (Video controls are in clear text for testing purposes). The actual item has attached to it z-index: -1000; Used as background video.

function mute() {
  document.getElementById("jsControl").setAttribute ("href", "javascript:unmute()");
  document.getElementById("jsControl").innerHTML = "🔈";
  document.getElementById("videoPlayer").volume = 0.0
  };

function unmute() {
  document.getElementById("jsControl").setAttribute ("href", "javascript:mute()");
  document.getElementById("jsControl").innerHTML = "🔊";
  document.getElementById("videoPlayer").volume = 1.0
  };
<html>
  <head>
    <style>
        body {
            font-family: [Insert font names and attempts];
        }
    </style>
  </head>
  <body>
    <video id="videoPlayer" src="..."></video>
    <a id="jsControl" href="javascript:unmute()">&#x1F508;</a>
  </body>
</html>
Run codeHide result

I tried using various web safe fonts such as Arial, Times New Roman and Tahoma and Sergoe UI.

Question: Is there any font that can be used that supports these Unicode characters that works in Chrome?
(Even a font that has these reassigned to regular letters, such as Wingdings, will be accepted, as they can be attached using @font-face { ... }.)

, , Javascript ( ) - . ; ( ), .

: Internet Explorer . , / .

+4
2

, , .

, , . fileformat.info, U + 1F507 Quivira, Symbola, Segoe UI Segoe UI Emoji. , Windows (, Windows 7 Segoe UI Emoji Segoe UI, ).

, , , - Quivira Symbola @font-face. , - , ( , , , ).

+2

, , , . . , ( http://emojisymbols.com/) CSS @font-face :

/*
EmojiSymbols Font (c)blockworks - Kenichi Kaneko
http://emojisymbols.com/
*/
@font-face {
    font-family: "EmojiSymbols";
    src: url('EmojiSymbols-Regular.woff') format('woff');
    text-decoration: none;
    font-style: normal;
}
.controlIcon {
    font-family: "EmojiSymbols";
}
+1

More articles:


All Articles