הקטנת תמונה

שלום לכולם,
עברתי לכאן מפורום צד שרת בתקווה שאולי כאן מישהו יצליח לעזור לי אולי למצוא פתרון בצד הלקוח.

יש לי דף עם כמה וכמה תמונות.
בניתי פונקציה שמקטינה תמונות ע"מ להקטין את התמונות שבעמוד לגודל מקסימלי שאני מגדיר ובצורה פרופורציונלית.
הפונקציה עובדת מצויין.
שמתי את ההרצה של הפונקציה ב onload של כל תמונה בעמוד, הבעיה שנוצרה היא שהתמונה נטענת בגודל אמיתי (עד שמסיימת לרדת למחשב) ורק אחכ הפונקציה מקטינה את התמונה וזה מכער את פעולת הדף.
חשבתי לטעון את התמונה ב display:none ואז בסוף שינוי הגודל להציג אותה שוב.
משום מה ב FireFox זה עובד מצויין וב IE לא עובד :/
קוד מצורף.
ההקטנה לצערי מתבצעת באירוע onload מה שאומר שרק אחרי שהתמונה סיימה לרדת אל המחשב היא תוקטן. מה שקורה במצב הזה הוא שהתמונה מורדת ומוצגת בגודל אמיתי ואז קטנה כמו שצריך, בזמן שהיא מוצגת בגודל מלא היא מזיזה ומשגעת את כל האתר (כמובן שאחכ זה מסתדר) וזה נראה ממש לא טוב.
חשבתי גם על visibility:hidden אך זה לא פותר את הבעיה כי התמונה רק מוסתרת אבל עדיין תופסת את המקום של התמונה המלאה בעמוד אז זה לא פותר את הבעיה.
חקרתי עוד יותר לעומק הבנתי שכנראה מדובר בבאג באקספלורר וזה קורה מכיוון שבסטטוס display:none הוא בכלל לא מזהה גודל של התמונה כי היא לא נטענת לעמוד ולכן הגודל שלה מבחינתו הוא 0.
אז בוא נראה מי התותח שיצליח לפתור את זה בלי יותר מדי סיבוכים אני חיפשתי בהמון פורומים ברשת וגם המון המון בגוגל ועדיין לא מצאתי פתרון לזה.

דף להדגמה בקובץ המצורף

מקווה שזה יעזור גם לאחרים שמחפשים את הפונקציה הזו
תודה מראש לעוזרים!!!