▼
Streaming live at 10am (PST)

JQuery / Javascript for kerning stopped working

#1

I have a word on my homepage that I kerned using the jquery plugin Lettering.js (http://letteringjs.com/)
The github link to these files are here: https://github.com/davatron5000/Lettering.js

Once you deploy lettering.js on your page you can then use kern.js (http://www.kernjs.com/) to kern the word you want.

This worked a few days ago when I first tried it out, but I redid my page and this time it isn't working.

I have the scripts in the custom code for my page all set. I don't understand why its no longer working.

Any help?

My page is here: http://david-stoltz-415a45.webflow.io/home-new

share link: https://preview.webflow.com/preview/david-stoltz-415a45?preview=3ad5af908613f4ee088f40d44159dae3
(page is Home New)

-Ariel

#2

Do NOT put custom jquery code in the header. Remove

<script
  src="http://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>

Move this to the footer instead

<script src="http://yourjavascript.com/2125739173/jquery-lettering.js"></script>

<script>
$(document).ready(function() {
  $(".quietly-headline").lettering();
});
</script>
#3

Thank you for responding! I can see the script spitting out the individual char's so that's working, I guess the kern.js and it's kerning via the browser screen doesn't work anymore. I'll have to adjust the spacing manually through css code.

#4

The effect produced by the jquery / javascript loads for a second and then goes away. Why? This kerning effect was working on the the site before. Please help.

#5

I don't think you can host scripts on dropbox. Look for one of my tutorials on hosting on github.

#6

Its working now. The text I was trying to kern had to be an h1, so its all good now. Thank you again for your help & responses to this!

-Ariel