Changing Body Font-Size based on Font-Family with jQuery

by

JavaScript doesn’t have an officially supported way of detecting fonts, but this library is a decent workaround: http://www.lalit.org/lab/javascript-css-font-detect

Using this detector, you can then use:

$(function(){
  var fontDetector = new Detector();
  if(fontDetector.test('Arial')){
    $('body').css('font-size', '10px');
  }
});

Also note that you should only change the font-size property. If you change the font property, you overwrite both your font size and your font families.

More Related Contents:

  1. How to automatically change the text size inside a div?
  2. Fit text perfectly inside a div (height and width) without affecting the size of the div
  3. Add Content to webpage using only CSS
  4. Why is my jQuery :not() selector not working in CSS?
  5. iframe to Only Show a Certain Part of the Page
  6. jQuery change class name
  7. $(window).width() not the same as media query
  8. Get element -moz-transform:rotate value in jQuery
  9. Play/pause HTML 5 video using JQuery
  10. Find text string in jQuery and make it bold
  11. Can I change the scroll speed using css or jQuery?
  12. jquery IE Fadein and Fadeout Opacity
  13. Activate CSS3 animation when the content scrolls into view
  14. jQuery toggle CSS?
  15. jQuery CSS – Write into the -tag
  16. jQuery: height()/width() and “display:none”
  17. How to find the highest z-index using jQuery
  18. Selecting only first-level elements in jquery
  19. Check, using jQuery, if an element is ‘display:none’ or block on click
  20. How can I tell if a particular CSS property is inherited with jQuery?
  21. Creating a hole in a element
  22. Can an iframe only show a certain part of the page?
  23. Apply CSS to jQuery Dialog Buttons
  24. CSS issue on Twitter Typeahead with Bootstrap 3
  25. How to keep footer at the bottom even with dynamic height website
  26. Use jQuery to Detect Container Overflow?
  27. Weird IE8 layout glitch – why does the body background disappear?
  28. jQuery css gradient
  29. Remove vertical lines in jqGrid
  30. Removing multiple classes (jQuery)

Leave a Comment