замените содержимое div без изменения размера или прокрутки

Я пытаюсь написать код, который заменяет старый контент заполнитель, когда загружается новый контент (через ajax).замените содержимое div без изменения размера или прокрутки

<div id="target"> 
... 
</div>

Во время цикла Ajax запрос-ответ, я хотел бы заменить содержимое целевого DIV с сообщением «Загрузка» или изображения.

До сих пор, это просто ...

Однако в некоторых случаях цель мала, и другие мишени велика. В любом случае я не хочу, чтобы размер целевого div изменился или появлялись полосы прокрутки. если загрузочное сообщение или изображение необходимо обрезать так, чтобы оно было.

Подпись (id, class, style) div 'target' должна оставаться неизменной на протяжении всего процесса, и я не могу установить ширину + высоту на целевом div.

Я не хочу полагаться на дополнительный код, выполняемый при получении нового контента.

Как вы подходите к этому, используя только базовые javascript/dhtml и/или prototype-js.

спасибо, стр.

источник

2010-09-13 pstanton

// prototype 
Object.prototype.updateFixedSizeHtml = function(html) 
{ 
    this.innerHTML = "<div style='width:" + this.clientWidth + "px;height:" + this.clientHeight + "px;overflow:hidden;display:block;padding:0;border:0;margin:0'>" + html + "</div>"; 
} 
// usage 
document.getElementById('target').updateFixedSizeHtml('New Content');

источник

2010-09-13 04:33:57 tidwall

Я не думаю, что 'clientWidth' является стандартным свойством всех элементов html (то есть div) и не обеспечивается прототипом-js. – pstanton

Он должен быть доступен в большинстве (всех современных?) Браузеров. Примером, который я опубликовал, является только DHTML. Не требуется структура prototype-js. https://developer.mozilla.org/en/DOM/element.clientWidth http://msdn.microsoft.com/en-us/library/ms533566(VS.85).aspx – tidwall

это лучшее, что я могу придумать сейчас:

function loading(id, content) 
{ 
    var elem = $(id); 
    if (!elem) 
     return; 

    var dim = elem.getDimensions(); 
    var width = dim.width - parseInt(elem.getStyle("padding-left")) - parseInt(elem.getStyle("padding-right")); 
    var height = dim.height - parseInt(elem.getStyle("padding-top")) - parseInt(elem.getStyle("padding-bottom")); 

    elem.innerHTML = "<div style=\"position:relative; overflow:hidden; padding:0; margin:0; border:0; width:" + width + "px; height:" + height + "px;\">" /* */ 
      + content + "</div>"; 
}

не стесняйтесь отправлять лучшее решение!

источник

2010-09-13 04:24:56 pstanton

замените содержимое div без изменения размера или прокрутки

ответ

Смежные вопросы