MSIE 10 supports gradients and loading but requires height: 'auto' to get image scaling right
This commit is contained in:
parent
48985985bf
commit
62af7f05a5
5 changed files with 20 additions and 11 deletions
|
@ -24,11 +24,14 @@ pandora.ui.home = function() {
|
||||||
right: 0,
|
right: 0,
|
||||||
bottom: 0,
|
bottom: 0,
|
||||||
width: '320px',
|
width: '320px',
|
||||||
|
height: 'auto',
|
||||||
margin: 'auto',
|
margin: 'auto',
|
||||||
opacity: 0,
|
opacity: 0,
|
||||||
MozTransform: 'scaleY(-1)',
|
MozTransform: 'scaleY(-1)',
|
||||||
|
MsTransform: 'scaleY(-1)',
|
||||||
OTransform: 'scaleY(-1)',
|
OTransform: 'scaleY(-1)',
|
||||||
WebkitTransform: 'scaleY(-1)'
|
WebkitTransform: 'scaleY(-1)',
|
||||||
|
transform: 'scaleY(-1)'
|
||||||
})
|
})
|
||||||
.appendTo(that),
|
.appendTo(that),
|
||||||
|
|
||||||
|
@ -60,6 +63,7 @@ pandora.ui.home = function() {
|
||||||
right: 0,
|
right: 0,
|
||||||
bottom: '160px',
|
bottom: '160px',
|
||||||
width: window.innerWidth + 'px',
|
width: window.innerWidth + 'px',
|
||||||
|
height: 'auto',
|
||||||
margin: 'auto',
|
margin: 'auto',
|
||||||
cursor: 'pointer'
|
cursor: 'pointer'
|
||||||
})
|
})
|
||||||
|
|
|
@ -37,8 +37,10 @@ pandora.ui.home = function() {
|
||||||
right: 0,
|
right: 0,
|
||||||
bottom: 0,
|
bottom: 0,
|
||||||
width: '320px',
|
width: '320px',
|
||||||
|
height: 'auto',
|
||||||
margin: '0 auto 0 auto',
|
margin: '0 auto 0 auto',
|
||||||
MozTransform: 'scaleY(-1)',
|
MozTransform: 'scaleY(-1)',
|
||||||
|
MsTransform: 'scaleY(-1)',
|
||||||
OTransform: 'scaleY(-1)',
|
OTransform: 'scaleY(-1)',
|
||||||
WebkitTransform: 'scaleY(-1)'
|
WebkitTransform: 'scaleY(-1)'
|
||||||
})
|
})
|
||||||
|
@ -72,6 +74,7 @@ pandora.ui.home = function() {
|
||||||
left: 0,
|
left: 0,
|
||||||
right: 0,
|
right: 0,
|
||||||
width: '320px',
|
width: '320px',
|
||||||
|
height: 'auto',
|
||||||
margin: '0 auto 0 auto',
|
margin: '0 auto 0 auto',
|
||||||
cursor: 'pointer'
|
cursor: 'pointer'
|
||||||
})
|
})
|
||||||
|
|
|
@ -43,7 +43,8 @@ appPanel
|
||||||
enableDebugMode = getLocalStorage('pandora.enableDebugMode'),
|
enableDebugMode = getLocalStorage('pandora.enableDebugMode'),
|
||||||
enableEventLogging = getLocalStorage('pandora.enableEventLogging'),
|
enableEventLogging = getLocalStorage('pandora.enableEventLogging'),
|
||||||
isEmbed = /^#embed(\?.*?)?$/.test(document.location.hash),
|
isEmbed = /^#embed(\?.*?)?$/.test(document.location.hash),
|
||||||
isMSIE = /MSIE/.test(navigator.userAgent),
|
isMSIE = /MSIE/.test(navigator.userAgent)
|
||||||
|
&& !(Math.round(navigator.userAgent.match(/MSIE (\d+)/)[1]) >= 10),
|
||||||
isPrint = /^#print(\?.*?)?$/.test(document.location.hash),
|
isPrint = /^#print(\?.*?)?$/.test(document.location.hash),
|
||||||
legacyThemes = {classic: 'oxlight', modern: 'oxdark'},
|
legacyThemes = {classic: 'oxlight', modern: 'oxdark'},
|
||||||
theme = getLocalStorage('Ox.theme')
|
theme = getLocalStorage('Ox.theme')
|
||||||
|
@ -106,6 +107,7 @@ appPanel
|
||||||
images.reflection.style.MSTransform = 'scaleY(-1)';
|
images.reflection.style.MSTransform = 'scaleY(-1)';
|
||||||
images.reflection.style.OTransform = 'scaleY(-1)';
|
images.reflection.style.OTransform = 'scaleY(-1)';
|
||||||
images.reflection.style.WebkitTransform = 'scaleY(-1)';
|
images.reflection.style.WebkitTransform = 'scaleY(-1)';
|
||||||
|
images.reflection.style.transform = 'scaleY(-1)';
|
||||||
images.reflection.src = '/static/png/logo.png';
|
images.reflection.src = '/static/png/logo.png';
|
||||||
}
|
}
|
||||||
images.loadingIcon = document.createElement('img');
|
images.loadingIcon = document.createElement('img');
|
||||||
|
@ -138,15 +140,12 @@ appPanel
|
||||||
gradient.style.width = isEmbed || isPrint ? '98px' : '322px';
|
gradient.style.width = isEmbed || isPrint ? '98px' : '322px';
|
||||||
gradient.style.height = isEmbed || isPrint ? '50px' : '162px';
|
gradient.style.height = isEmbed || isPrint ? '50px' : '162px';
|
||||||
gradient.style.margin = 'auto';
|
gradient.style.margin = 'auto';
|
||||||
gradient.style.background = theme == 'oxlight' ? '-moz-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))'
|
['-moz-', '-ms-', '-o-', '-webkit-', ''].forEach(function(prefix) {
|
||||||
: theme == 'oxmedium' ? '-moz-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))'
|
gradient.style.background = theme == 'oxlight' ? prefix + 'linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))'
|
||||||
: '-moz-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))';
|
: theme == 'oxmedium' ? prefix + 'linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))'
|
||||||
gradient.style.background = theme == 'oxlight' ? '-o-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))'
|
: prefix + 'linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))';
|
||||||
: theme == 'oxmedium' ? '-o-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))'
|
|
||||||
: '-o-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))';
|
});
|
||||||
gradient.style.background = theme == 'oxlight' ? '-webkit-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))'
|
|
||||||
: theme == 'oxmedium' ? '-webkit-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))'
|
|
||||||
: '-webkit-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))';
|
|
||||||
}
|
}
|
||||||
var loadingScreen = document.createElement('div');
|
var loadingScreen = document.createElement('div');
|
||||||
loadingScreen.setAttribute('id', 'loadingScreen');
|
loadingScreen.setAttribute('id', 'loadingScreen');
|
||||||
|
@ -489,6 +488,7 @@ appPanel
|
||||||
loadingIcon.style.MSTransform = css;
|
loadingIcon.style.MSTransform = css;
|
||||||
loadingIcon.style.OTransform = css;
|
loadingIcon.style.OTransform = css;
|
||||||
loadingIcon.style.WebkitTransform = css;
|
loadingIcon.style.WebkitTransform = css;
|
||||||
|
loadingIcon.style.transform = css;
|
||||||
}, 83);
|
}, 83);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -118,6 +118,7 @@ pandora.ui.siteDialog = function(section) {
|
||||||
})
|
})
|
||||||
.css({
|
.css({
|
||||||
width: '256px',
|
width: '256px',
|
||||||
|
height: 'auto',
|
||||||
marginTop: id == 'software' ? '-16px' : 0
|
marginTop: id == 'software' ? '-16px' : 0
|
||||||
})
|
})
|
||||||
),
|
),
|
||||||
|
|
|
@ -86,6 +86,7 @@ pandora.ui.siteDialog = function(section) {
|
||||||
})
|
})
|
||||||
.css({
|
.css({
|
||||||
width: '256px',
|
width: '256px',
|
||||||
|
height: 'auto',
|
||||||
marginTop: id == 'software' ? '-16px' : 0
|
marginTop: id == 'software' ? '-16px' : 0
|
||||||
})
|
})
|
||||||
),
|
),
|
||||||
|
|
Loading…
Reference in a new issue