better icon loading for firefox
This commit is contained in:
parent
34f655104a
commit
1d00e6dc2e
6 changed files with 29 additions and 17 deletions
|
@ -165,7 +165,7 @@ Lists
|
||||||
================================================================================
|
================================================================================
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.OxThemeClassic .OxIconList .OxItem > .OxIcon img.OxLoading {
|
.OxThemeClassic .OxIconList .OxItem img.OxLoading {
|
||||||
border-color: rgb(208, 208, 208);
|
border-color: rgb(208, 208, 208);
|
||||||
background: -moz-linear-gradient(top, rgb(255, 255, 255), rgb(224, 224, 224));
|
background: -moz-linear-gradient(top, rgb(255, 255, 255), rgb(224, 224, 224));
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(255, 255, 255)), color-stop(1, rgb(224, 224, 224)));
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(255, 255, 255)), color-stop(1, rgb(224, 224, 224)));
|
||||||
|
|
|
@ -692,7 +692,7 @@ Lists
|
||||||
|
|
||||||
.OxIconList .OxItem > .OxIcon,
|
.OxIconList .OxItem > .OxIcon,
|
||||||
.OxIconList .OxItem > .OxText {
|
.OxIconList .OxItem > .OxText {
|
||||||
left: -2px;
|
//left: -2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.OxIconList .OxItem > .OxIcon img {
|
.OxIconList .OxItem > .OxIcon img {
|
||||||
|
|
|
@ -146,7 +146,7 @@ Lists
|
||||||
================================================================================
|
================================================================================
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.OxThemeModern .OxIconList .OxItem > .OxIcon img.OxLoading {
|
.OxThemeModern .OxIconList .OxItem img.OxLoading {
|
||||||
border-color: rgb(48, 48, 48);
|
border-color: rgb(48, 48, 48);
|
||||||
background: -moz-linear-gradient(top, rgb(32, 32, 32), rgb(0, 0, 0));
|
background: -moz-linear-gradient(top, rgb(32, 32, 32), rgb(0, 0, 0));
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(32, 32, 32)), color-stop(1, rgb(0, 0, 0)));
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(32, 32, 32)), color-stop(1, rgb(0, 0, 0)));
|
||||||
|
|
|
@ -1731,7 +1731,7 @@ Ox.wordwrap = function(str, len, sep, bal, spa) {
|
||||||
>>> Ox.wordwrap("These are short words", 16, "<br/>", true)
|
>>> Ox.wordwrap("These are short words", 16, "<br/>", true)
|
||||||
These are <br/>short words
|
These are <br/>short words
|
||||||
*/
|
*/
|
||||||
var str = str.toString(),
|
var str = str === null ? '' : str.toString(),
|
||||||
len = len || 80,
|
len = len || 80,
|
||||||
sep = sep || "<br/>",
|
sep = sep || "<br/>",
|
||||||
bal = bal || false,
|
bal = bal || false,
|
||||||
|
|
|
@ -5719,7 +5719,7 @@ requires
|
||||||
height: self.options.size * 1.5,
|
height: self.options.size * 1.5,
|
||||||
lineLength: self.options.size == 64 ? 17 : 23,
|
lineLength: self.options.size == 64 ? 17 : 23,
|
||||||
lines: self.options.size == 64 ? 4 : 5,
|
lines: self.options.size == 64 ? 4 : 5,
|
||||||
url: oxui.path + '/png/ox.ui.' + Ox.theme() + '/icon.png',
|
url: oxui.path + '/png/ox.ui/transparent.png',
|
||||||
width: self.options.size
|
width: self.options.size
|
||||||
});
|
});
|
||||||
self.title = formatText(self.options.title, self.lines - 1, self.lineLength);
|
self.title = formatText(self.options.title, self.lines - 1, self.lineLength);
|
||||||
|
@ -5732,14 +5732,14 @@ requires
|
||||||
that.$icon = $('<div>')
|
that.$icon = $('<div>')
|
||||||
.addClass('OxIcon')
|
.addClass('OxIcon')
|
||||||
.css({
|
.css({
|
||||||
top: self.options.size == 64 ? -68 : -120,
|
top: self.options.size == 64 ? -72 : -124,
|
||||||
width: (self.options.size + 4) + 'px',
|
width: (self.options.size + 4) + 'px',
|
||||||
height: self.options.size + 'px'
|
height: (self.options.size + 4) + 'px'
|
||||||
});
|
});
|
||||||
that.$iconImage = $('<img>')
|
that.$iconImage = $('<img>')
|
||||||
.addClass('OxLoading OxTarget')
|
.addClass('OxLoading OxTarget')
|
||||||
.attr({
|
.attr({
|
||||||
src: self.options.url
|
src: self.url
|
||||||
})
|
})
|
||||||
.css({
|
.css({
|
||||||
width: self.options.width + 'px',
|
width: self.options.width + 'px',
|
||||||
|
@ -5748,7 +5748,7 @@ requires
|
||||||
.mousedown(mousedown)
|
.mousedown(mousedown)
|
||||||
.mouseenter(mouseenter)
|
.mouseenter(mouseenter)
|
||||||
.mouseleave(mouseleave)
|
.mouseleave(mouseleave)
|
||||||
.load(load);
|
.one('load', load);
|
||||||
that.$textBox = $('<div>')
|
that.$textBox = $('<div>')
|
||||||
.addClass('OxText')
|
.addClass('OxText')
|
||||||
.css({
|
.css({
|
||||||
|
@ -5770,17 +5770,19 @@ requires
|
||||||
.addClass('OxReflection')
|
.addClass('OxReflection')
|
||||||
.css({
|
.css({
|
||||||
top: self.options.size + 'px',
|
top: self.options.size + 'px',
|
||||||
width: self.options.size + 'px',
|
width: (self.options.size + 4) + 'px',
|
||||||
height: (self.options.size / 2) + 'px'
|
height: (self.options.size / 2) + 'px'
|
||||||
});
|
});
|
||||||
that.$reflectionImage = $('<img>')
|
that.$reflectionImage = $('<img>')
|
||||||
.addClass('OxLoading')
|
.addClass('OxLoading')
|
||||||
.attr({
|
.attr({
|
||||||
src: self.options.url
|
src: self.url
|
||||||
})
|
})
|
||||||
.css({
|
.css({
|
||||||
width: self.options.width + 'px',
|
width: self.options.width + 'px',
|
||||||
height: self.options.height + 'px'
|
height: self.options.height + 'px',
|
||||||
|
// firefox is 1px off when centering images with odd width and scaleY(-1)
|
||||||
|
paddingLeft: ($.browser.mozilla && self.options.width % 2 ? 1 : 0) + 'px'
|
||||||
});
|
});
|
||||||
that.$gradient = $('<div>')
|
that.$gradient = $('<div>')
|
||||||
.css({
|
.css({
|
||||||
|
@ -5821,8 +5823,16 @@ requires
|
||||||
}
|
}
|
||||||
|
|
||||||
function load() {
|
function load() {
|
||||||
that.$iconImage.removeClass('OxLoading');
|
that.$iconImage.attr({
|
||||||
that.$reflectionImage.removeClass('OxLoading');
|
src: self.options.url
|
||||||
|
})
|
||||||
|
.one('load', function() {
|
||||||
|
that.$iconImage.removeClass('OxLoading');
|
||||||
|
that.$reflectionImage.removeClass('OxLoading');
|
||||||
|
});
|
||||||
|
that.$reflectionImage.attr({
|
||||||
|
src: self.options.url
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function mousedown(e) {
|
function mousedown(e) {
|
||||||
|
@ -6071,9 +6081,11 @@ requires
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPage() {
|
function getPage() {
|
||||||
return self.options.orientation == 'horizontal'
|
return Math.max(
|
||||||
? Math.floor((that.scrollLeft() - self.listMargin / 2) / self.pageWidth)
|
Math.floor(self.options.orientation == 'horizontal' ?
|
||||||
: Math.floor((that.scrollTop() - self.listMargin / 2) / self.pageHeight);
|
(that.scrollLeft() - self.listMargin / 2) / self.pageWidth :
|
||||||
|
(that.scrollTop() - self.listMargin / 2) / self.pageHeight
|
||||||
|
), 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getPositions() {
|
function getPositions() {
|
||||||
|
|
BIN
build/png/ox.ui/transparent.png
Normal file
BIN
build/png/ox.ui/transparent.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.7 KiB |
Loading…
Reference in a new issue