diff --git a/lib/jquery.webfonts.js b/lib/jquery.webfonts.js index f3edc3e3..63c34f61 100644 --- a/lib/jquery.webfonts.js +++ b/lib/jquery.webfonts.js @@ -61,8 +61,10 @@ * @return {String} Font family name */ getFont: function( language ) { + language = ( language || this.language ).toLowerCase(); + if ( this.options.fontSelector ) { - return this.options.fontSelector( this.repository, language || this.language ); + return this.options.fontSelector( this.repository, language ); } else { return this.repository.defaultFont( language ); } @@ -211,7 +213,15 @@ // Load and apply fonts for other language tagged elements (batched) if ( element.lang && element.lang !== webfonts.language ) { - fontFamily = webfonts.getFont( element.lang ); + // language differs. We may want to apply a different font. + if ( webfonts.hasExplicitFontStyle ( $element ) ) { + // respect the explicit font family style. Do not override. + // This style may be from css, inheritance, or even from + // browser settings. + return; + } else { + fontFamily = webfonts.getFont( element.lang ); + } if ( !fontFamily ) { // No font preference for the language. @@ -246,6 +256,24 @@ } ); }, + /** + * Find out whether an element has explicit non generic font family style + * For the practical purpose we check whether font is same as top element + * or having any of generic font family + * http://www.w3.org/TR/CSS2/fonts.html#generic-font-families + * @param {jQuery} $element + * @return {boolean} + */ + hasExplicitFontStyle: function ( $element ) { + var elementFontFamily = $element.css( 'fontFamily' ); + + // whether the font is inherited from top element to which plugin applied + return this.$element.css( 'fontFamily' ) !== elementFontFamily + // whether the element has generic font family + && ( $.inArray( elementFontFamily, + ['monospace', 'serif', 'cursive','fantasy', 'sans-serif'] ) < 0 ); + }, + /** * List all fonts for the given language * @@ -375,10 +403,6 @@ fontFaceRule += '\tfont-weight:' + fontconfig.fontweight + ';'; } - if ( fontconfig.fontweight !== undefined ) { - fontFaceRule += '\tfont-weight:' + fontconfig.fontweight + ';'; - } - if ( fontconfig.fontstyle !== undefined ) { fontFaceRule += '\tfont-style:' + fontconfig.fontstyle + ';'; } else {