Custom font does not work in phone stutter

Question

I am trying to use a custom font in a phone using -

@font-face { font-family: "customfont"; src: url("./fonts/CFBacktoSchool-Regular.ttf") format("truetype"); } body { font-family: "customfont"; } 

but it does not work for me.
What is the problem? Help me please!

Answer 1

finally, I overcame this problem in Persian and Arabic fonts,

Save all codes with @fontface just like him. Download this package http://averta.net/labs/fa/?p=10

From the extracted archive add bifon-1.1b.js to your html and use this script

 function onDeviceReady() { $('#txt1').text(FarsiStyle.convert('سلام عليكم').split('').reverse().join('').split(' ').reverse().join(' ')); } 

which txt1 is a div or span.

Answer 2

Possible problems are the default index.css in cordova. Check if the body element has the style defined for " text-transform: uppercase ".

At least this was a problem for me, after removing this default body element index.css, if you use it in your application, can also help you.

For me, I used the gurmukhi / punjabi fonts, and after removing the line from index.css it just worked like a charm with below css definitions

Example:

 .demo { font-family: anmol } @font-face { font-family: anmol; src: url(../fonts/anmol.ttf); }