2 * viewport-units-buggyfill.hacks v0.4.1
3 * @web: https://github.com/rodneyrehm/viewport-units-buggyfill/
4 * @author: Zoltan Hawryluk - http://www.useragentman.com/
7 (function (root, factory) {
9 if (typeof define === 'function' && define.amd) {
10 // AMD. Register as an anonymous module.
12 } else if (typeof exports === 'object') {
13 // Node. Does not work with strict CommonJS, but
14 // only CommonJS-like enviroments that support module.exports,
16 module.exports = factory();
18 // Browser globals (root is window)
19 root.viewportUnitsBuggyfillHacks = factory();
25 var calcExpression = /calc\(/g;
26 var quoteExpression = /[\"\']/g;
27 var urlExpression = /url\([^\)]*\)/g;
28 var isOldInternetExplorer = false;
29 var supportsVminmax = true;
30 var supportsVminmaxCalc = true;
33 // Do not remove the following conditional comment.
34 // It is required to identify the current version of IE
38 @if (@_jscript_version <= 10)
39 isOldInternetExplorer = true;
40 supportsVminmaxCalc = false;
41 supportsVminmax = false;
46 // iOS SAFARI, IE9: abuse "content" if "use_css_content_hack" specified
47 // IE9: abuse "behavior" if "use_css_behavior_hack" specified
48 function checkHacks(declarations, rule, name, value) {
49 if (!options.contentHack && !options.behaviorHack) {
53 if (name !== 'content' && name !== 'behavior') {
57 var needsCalcFix = (options.contentHack && !supportsVminmaxCalc && name === 'content' && value.indexOf('use_css_content_hack') > -1);
58 var needsVminVmaxFix = (options.behaviorHack && !supportsVminmax && name === 'behavior' && value.indexOf('use_css_behavior_hack') > -1);
59 if (!needsCalcFix && !needsVminVmaxFix) {
63 var fakeRules = value.replace(quoteExpression, '');
64 if (needsVminVmaxFix) {
65 fakeRules = fakeRules.replace(urlExpression, '');
68 fakeRules.split(';').forEach(function(fakeRuleElement) {
69 var fakeRule = fakeRuleElement.split(':');
70 if (fakeRule.length !== 2) {
74 var name = fakeRule[0].trim();
75 var value = fakeRule[1].trim();
76 if (name === 'use_css_content_hack' || name === 'use_css_behavior_hack') {
80 declarations.push([rule, name, value]);
81 if (calcExpression.test(value)) {
82 var webkitValue = value.replace(calcExpression, '-webkit-calc(');
83 declarations.push([rule, name, webkitValue]);
89 required: function(options) {
90 return options.isMobileSafari || isOldInternetExplorer;
93 initialize: function(initOptions) {
94 options = initOptions;
96 // Test viewport units support in calc() expressions
97 var div = document.createElement('div');
98 div.style.width = '1vmax';
99 supportsVminmax = div.style.width !== '';
101 // there is no accurate way to detect this programmatically.
102 if (options.isMobileSafari) {
103 supportsVminmaxCalc = false;
107 initializeEvents: function(options, refresh, _refresh) {
112 if (isOldInternetExplorer && !options._listeningToResize) {
113 window.addEventListener('resize', _refresh, true);
114 options._listeningToResize = true;
118 findDeclarations: function(declarations, rule, name, value) {
120 // KeyframesRule does not have a CSS-PropertyName
124 checkHacks(declarations, rule, name, value);
127 overwriteDeclaration: function(rule, name, _value) {
128 if (isOldInternetExplorer && name === 'filter') {
129 // remove unit "px" from complex value, e.g.:
130 // filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=5.4px, OffY=3.9px, Color=#000000);
131 _value = _value.replace(/px/g, '');