Добавление изображения в цикле вешает браузер
Есть такой код для зума изображений (велосипед jquery zoom):
function Zoom(imgclass) { var images = getElementsByClassName(imgclass); for ( var i = 0; i < images.length; i++ ) { var tip = document.createElement('DIV'); tip.style.cssText = 'overflow: hidden; display: none; width: 50px; height: 50px; border: 1px solid #EEEEEE; position: absolute; background: #FFFFFF;'; images[i].offset = getOffset(images[i]); tip.appendChild(images[i].cloneNode(true)); // Вешает браузер! images[i].parentNode.insertBefore(tip, images[i].nextSibling); addEvent(images[i], 'mouseover', function () { // this.nextSibling.innerHTML = '<img src="' + this.src + '" width="' + (this.offsetWidth * 2) + '" height="' + (this.offsetHeight * 2) + '" />'; this.nextSibling.style.display = 'block'; }); addEvent(images[i], 'mouseout', function () { this.nextSibling.style.display = 'none'; }); addEvent(images[i], 'mousemove', function (event) { var tip = this.nextSibling, img = tip.firstChild; tip.style.top = event.pageY + 10; tip.style.left = event.pageX + 10; img.style.marginTop = -event.pageY * 2 + this.offset.top * 2 + 25; img.style.marginLeft = -event.pageX * 2 + this.offset.left * 2 + 25; }); } } Проблема: при добавлении изображения в цикле (строка 7) браузер подвисает, скрипт не работает, консоль молчит. Если добавлять изображение при каждом mouseover (строка 10), то работает, но я хочу сделать по-человечески. Так же, пробовал через innerHTML, не работает. В чём дело? |
надо страничку, чтобы попробовать, так по коду не понятно
|
http://qlib.ucoz.ru/zoom.htm
UPD: только что попробовал поставить алерт после вызова Zoom() — его нет => браузер подвисает из-за бесконечного цикла. Как я понял, это из-за того, что images.length меняется из-за того, что я добавляю изображения динамически. Кэширование images.length помогло избавиться от бесконечного цикла, но эта строка всё равно не работает: tip.innerHTML = '<img src="' + images[i].src + '" width="' + (images[i].offsetWidth * 2) + '" height="' + (images[i].offsetHeight * 2) + '" />'; (если добавлять через .appendChild(), то то же самое) Консоль молчит. |
Странно, пример по ссылке вроде работает, никаких ошибок и подвисаний не заметил
|
Цитата:
Проблема уже решена. |
Часовой пояс GMT +3, время: 22:13. |