setInterval lassú IE 7-ben 8-ban!
Sziasztok!
Egy olyan problémával akadtam össze, hogy a
Részlet:használat:Nem igen használtam még a setInterval-t de ha valaki ismeri ezt a jelenséget megköszönném ha fel homályosítana, hogy hogyan lehet azt megoldani, hogy az időzítés működjön rendesen Explorer régebbi verzáin.
Előre is köszönöm!
■ Egy olyan problémával akadtam össze, hogy a
setInterval függvény Explorer 7 és 8-as verzióiban lassan dolgozik.Részlet:
var fadeOut = Effect.fadeOut = function(elem, ms) {
var filter = 'opacity' in elem.style ? false : true,
start = 100;
if (filter) {
elem.style.filter = 'alpha(opacity=' + start + ')';
}
else {
elem.style.opacity = start / 100;
}
var interval = Math.round(ms / 100);
var timer = window.setInterval(function() {
if (filter) {
elem.style.filter = 'alpha(opacity=' + --start + ')';
}
else {
elem.style.opacity = --start / 100;
}
if (start === 0) {
window.clearInterval(timer);
}
}, interval);
};
window.onload = function() {
var img = document.getElementById('img');
Effect.fadeOut(img, 1000);
};
Előre is köszönöm!
Lassú?
setIntervalilletve asetTimeoutlefut. Ez újabb böngészők esetén, régiekben valamivel lassabb. Ha azt akarod, hogy egy meghatározott idő alatt fusson le az animáció, akkorsetIntervalhelyettsetTimeout-ot használj, és folyamatosan kalibráld újra az időzítést, hogy lehetőleg akkor fejeződjön be, amikor te szeretnéd, de mindenképpen minimálisinterval-nak 13-15ms-et adjál meg.Nem tudom, mennyire ismered a JavaScript események viselkedését. A JavaScript egy szálon fut (ez böngésző laponként egy szálat jelent). A JavaScript kód el kezd futni, majd elkezdi bepakolni a következőleg lejátszandó eseményeket egy pool-ba. Majd amikor az aktuális esemény lefutott, kiveszi a következőt, lefuttatja stb. Azaz ha egy esemény nagyon sokáig fut (például nagyon sokáig számol valamit), akkor a következő események eltolódnak. Azaz tegyük fel, hogy beállítasz egy
setInterval-t mondjuk fél másodpercre. Ekkor ha asetInterval-ban levő kód egy másodpercig fut, akkor a következő lépés csak azután fog lefutni, hogy ez az egy másodperces kód lefutott. Ha asetInteval-os kódodat mondjuk 10szer akarod lefuttatni, akkor az ebben az esetben az elvárt 5 másodperc helyett 10 másodpercig fog tartani, mivel egymásra fognak torlódni az események.Mit értesz azon, hogy
Most itt azt szeretném elérni, hogy ha meghívom a
Effect.fadeOut(image, 1000)formulát, akkor 1 másod perc alatt tűnjön el a kép úgy, hogy századokkal csökkentem aimage.style.opacitytulajdonságát, és az 1 másodperc alatt érje el a0értéket. Azon, hogy lassú azt értem, hogy Explorer-ben ez kb 3 másodperc ez 1 helyett.Egyébként az tudom, hogy egy szálon fut a kód, és nulla script fut az oldalon, én is gondoltam arra, hogy valami miatt (ami te mondasz torlódás) nem fut le időben a kód. de ha valami lassíthat az maximum ez a sor:
Ki írattam konzolra az egyes
Explorer 200al kezd és utána 30-40 között mozog.
Firefox 70el kezd és utána 0-40 között mozog.
Chrome 16al kezd és utána 9-11 között mozog.
azért kösz a segítséget.
Még nagyon sok évvel ezelőtt
Hali! Ezt most nem értem,
Ezt most nem értem, nekem 10 ms helyett is 40 ms mire újra meghívódik az interval függvény, hogy tudod ezt gyorsítani a dátum objektumokkal? Vagy úgy gondoltad, hogy egy timeStamp-ot letárolok, és megnézem, hogy menyivel csúszott a függvényhívás és pluszba meghívom hogy utolérje magát?
Úgy is lehet... Mondjuk
Mondjuk csinálsz egy intervalt, amit 10 msecenként hívsz, és az számol a date-el egy szorzót, hogy mekkora az eltérés a várthoz képest. pl: 10 msec-et állítasz be, de 20 msec jön ki a Date eltérésből. Akkor a szorzód 20/10=2. Ezután az 1000msec-es animációdra már be tudod állítani, hogy 1000/2=500msec alatt fusson le, így a tényleges futási ideje 1000msec lesz. Ez mondjuk a legegyszerűbb rátákolás a problémára.