Проблема с изображением JavaScript в Internet Explorer - PullRequest
1 голос
/ 29 июля 2010

Я следую книге Джереми Кейта «Сценарии DOM», и я ударился о стену, пытаясь заставить небольшую галерею изображений правильно отображаться в 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);
}

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

In Chrome In Explorer

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

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

1 Ответ

1 голос
/ 30 июля 2010

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

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

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...