Unable to load @font-face with Chrome, error with jquery?

116
June 12, 2018, at 3:10 PM

Trying to load an @font-face in Chrome, untested with other browsers.

@font-face {
font-family: titleFont;
src: url('/fonts/VanadineBold.ttf') format("truetype");
/*Have also tried...*/
/*src: url('/fonts/VanadineBold.woff') format("woff");*/
/*src: url('/fonts/VanadineBold.woff2') format("woff2");*/
font-weight: normal;
font-style: normal;
}
p#title {
font-family: titleFont, sans-serif;
position: absolute;
top: 5%;
left: 50%;
transform: translate(-50%, -50%);
}

Keep's loading the font as sans-serif, as well as throwing this error in console..?

jquery.min.js:2 GET http://localhost:63342/fonts/VanadineBold.ttf 404 (Not Found)

This is my folder structure...

The root folder:

Inside the fonts folder:

Answer 1

Looking at this document, format('truetype') seems to be for Safari.

@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

Try using a .woff font for chrome:

src: url('webfont.woff') format('woff')
READ ALSO
c# - adding javascript function from codebehind

c# - adding javascript function from codebehind

Hi, from the code above, i would want to add javascript in code behind like <script> var naArray = ["01/01/2018","02/01/2018"];</script>However, when i execute, it become <script> var naArray = ["01/01/2018"]; <script> which "02/01/2018"...

96
Search box on web has wrong format(attached css and html files)

Search box on web has wrong format(attached css and html files)

My search box has a wrong format on front-end page, I don't know where goes wrong, I pasted my css and html files as below, and partial code of javascript as this link

48
Website nav is not open why? (Supr.Admin) [on hold]

Website nav is not open why? (Supr.Admin) [on hold]

I downloaded this template from website but unfortunately when I jump at dashboardhtml loading image show and when I hide loading tag and try to open right side nav muni at mobile version it not open

39
Updating results after submissions of data via AJAX, jQuery, PHP

Updating results after submissions of data via AJAX, jQuery, PHP

I'm trying to figure out the best way to go about submitting data via AJAX once the database has loaded, then updating on submission, much like you'd expect a chat system to work

84