Internet Explorer Javascript Image Задача

Question

Я следую за книгой «DOM Scripting» Джереми Кейта, и я ударил стену, пытаясь получить небольшую галерею изображений, чтобы правильно отобразить в Internet Explorer 6/7.

У меня есть 4 миниатюры, которые загружаются в качестве заполнителя при нажатии, используя следующий код:

function showPic(whichpic) { 
    if (!document.getElementById("placeholder")) return true; 
    var source = whichpic.getAttribute("href"); 
    var placeholder = document.getElementById("placeholder"); 
    placeholder.setAttribute("src",source); 
    if (!document.getElementById("description")) return false; 
    var text = whichpic.getAttribute("title") ? whichpic.getAttribute("title") : ""; 
    var description = document.getElementById("description"); 
    if (description.firstChild.nodeType == 3) { 
     description.firstChild.nodeValue = text; 
    } 
    return false; 
} 

Мой заполнитель вставляется в страницу с помощью createElement("img"), однако, когда я нажимаю на миниатюру изображение сжимается до размера заменителя.

function preparePlaceholder() { 
    if(!document.createElement) return false; 
    if(!document.createTextNode) return false; 
    if(!document.getElementById) return false; 
    if(!document.getElementById("imagegallery")) return false; 
    var placeholder = document.createElement("img"); 
    placeholder.setAttribute("id","placeholder"); 
    placeholder.setAttribute("src","images/placeholder.gif"); 
    placeholder.setAttribute("alt","Gallery Placeholder"); 
    var description = document.createElement("p"); 
    description.setAttribute("id","description"); 
    var desctext = document.createTextNode("Choose an image"); 
    description.appendChild(desctext); 
    var gallery = document.getElementById("imagegallery"); 
    insertAfter(placeholder,gallery); 
    insertAfter(description,placeholder); 
} 

Таким образом, результат, как на фото ниже перекос изображения:

Живой сайт здесь: http://anarchist.webuda.com/

Javascript здесь: http://pastebin.com/kaAhjdqk HTML здесь: http://pastebin.com/Dm5p2Dj6 CSS здесь : http://pastebin.com/yiVPiQZe

Answer 1

Попробуйте добавить к функции showPic следующие 2 строки после placeholder.setAttribute("src",source);

placeholder.removeAttribute('width'); 
placeholder.removeAttribute('height'); 

Использование IE8 Developer Tools (в режиме совместимости) я мог бы воспроизвести проблему и обнаружили, что width и height присваиваемые автоматически. Поэтому я тестировал с помощью отладчика, используя removeAttribute, и изображение увеличилось до нужного размера. Но я не знаю, подходит ли место для этих строк, так что дайте мне знать.