A vBulletin fórummotornál láttam azt az érdekes ficsört, hogy IE alatt a kilépésre rákérdező ablak mögött minden fekete-fehérre változik. Szerintem kifejezetten jópofa. :)
Körülbelül így néz ki a kód:
document.body.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);';
if (confirm('Biztos hogy ki akarsz lépni?')) {
return true;
}
document.body.style.filter = '';
return false;
}
Legnagyobb sajnálatomra az általam készített rendszereket is nagy arányban használják IE alatt, így arra gondoltam, hogy akkor ilyen nekem is kell. :)
Mivel a böngésző confirm függvénye helyett az Ext.Msg.confirm függvényt használom, ezért a sima document.body színtelenítése magát az confirm ablakot is színtelenítené. Ennek elkerülése miatt a fentieknél kicsivel hosszabb kóddal kell számolnunk...
Első lépésben az Element osztályhoz hozzárendelem a színtelenítést:
var grayscaleFilter = 'progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);';
return {
addGrayscale: function () {
this.removeGrayscale();
if (Ext.isIE) {
this.dom.style.filter += grayscaleFilter;
}
},
removeGrayscale: function () {
if (Ext.isIE) {
this.dom.style.filter = this.dom.style.filter.replace(grayscaleFilter, '');
}
}
};
}());
Második lépésben az összetételnek is meg kell adni ezeket a függvényeket. Nem biztos, hogy ez a legelegánsabb megoldás, én a következő módon szoktam ezt megoldani:
Ext.CompositeElementLite.prototype[fn] = function () {
var args = arguments;
this.each(function (item) {
item[fn].apply(item, args);
});
};
});
Mivel a document.body -t nem színezhetem át, ezért helyette a látható gyerekelemeit fogom átszínezni, ami például a Ext.getBody().select('> *:visible') utasítással kapok meg.
Tehát a fenti kód az alábbi módon változott meg:
var items = Ext.getBody().select('> *:visible'),
title = 'Kilépés',
msg = 'Biztos hogy ki akarsz lépni?';
Ext.Msg.confirm(title, msg, function (btn) {
if (btn === 'yes') {
document.location.href = link.href;
} else {
items.removeGrayscale();
}
});
items.addGrayscale();
return false;
}
