Форум PHP программистов > JS При добавлении img все виснет

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: JS При добавлении img все виснет

EvilDev

17.11.2011 - 03:08

Всем привет.

Написал скрипт на JS, осталось последнее, добавить картинку. Делаю так.


function CreateImage(src, width, height)
{
	var img = document.createElement('img');
	img.src = src;
	img.width = width;
	img.height = height;
	return img;
}

И в цикле добавления картинок в контент делаю
content.appendChild( CreateImage(object.src, object.width, object.height) );

Тут FF и Chrome виснут, ен могу понять в чем дело..
Кто нить сталкивался с такой проблемой?

Спустя 7 минут, 30 секунд (17.11.2011 - 02:15) vital написал(а):

проблема в цикле.
Тот кусок, к-й опущен.

Спустя 7 часов, 58 минут, 34 секунды (17.11.2011 - 10:14) redreem написал(а):

порой JS отдает не копию объекта, а рефер на него. сам еще до конца не разобрался в каких случаях, но в работе предпочитаю сначала явно глобально инициализировать объект, а уже потом с ним работать. в этом случае я бы сделал img = new Array(); и все ссылки создаваемые картинки держал бы в массиве, индекс которого можно контролировать. в твоем варианте кода проблематично отследить что происходит во внутренней структуре.

Спустя 8 часов, 53 минуты, 23 секунды (17.11.2011 - 19:07) EvilDev написал(а):

Вопрос еще актуален.

Не совсем понял... У меня такая задача. Если кратко, то надо найти на странице все картинки, наложить фон на всю страницу и на него скопировать картинки.

Вот как это сделано:


function createImage(object,inner,width,height)
{
    var hover = document.createElement("div");

	if (width > 0)
		object.width = width;
    
	if (height > 0)
		object.height = height;

    hover.setAttribute("class","fi-hover"); // рамка
    if(inner){
		hover.style.width = width - 10 + "px";
		hover.style.height = height - 10 + "px";
		hover.style.top = findPosY(object) + "px";
		hover.style.left = findPosX(object) + "px";
    }

    var hoverHTML = '';
    hoverHTML += "<form action='...' method='post' target='_blank' onsubmit='sended(this)'>";
    hoverHTML += "<input type='hidden' value='" + object.width + "x" + object.height + "' name='wh' />";
    hoverHTML += "<input type='hidden' value='" + object.src + "' name='media' />";
    hoverHTML += "<div class='fi-submit'>";
    hoverHTML += "<input type='submit' value='' class='fi-btn' /></div>";
    hoverHTML += "</form>";

    hover.innerHTML += hoverHTML;

    var whiContents = document.getElementById('fi-contents');
    whiContents.appendChild(hover);
}

createElement('img') проходит нормально, но если начинать добавлять свойства, браузер виснет

Спустя 19 часов, 26 минут, 10 секунд (18.11.2011 - 14:34) EvilDev написал(а):

Ребят, помогите!

Спустя 52 минуты, 22 секунды (18.11.2011 - 15:26) bodja написал(а):

Цитата

Написал скрипт на JS, осталось последнее, добавить картинку. Делаю так.


<body id="b1">

</body>
<script Language="JavaScript">
for (i=0;i<7;i++) {
images('./bg1.jpg',40,80);
}
function images(src,h,w) {
document.getElementById('b1').innerHTML+="<img src='"+src+"' height="+h+" width="+w+" />";
}

Спустя 8 минут, 54 секунды (18.11.2011 - 15:35) EvilDev написал(а):

bodja
Я так делал. Браузер виснет

Chrome, FF
Точнее сразу добавлял в hoverHTML <img ...>

Спустя 13 минут, 1 секунда (18.11.2011 - 15:48) bodja написал(а):

Ну у меня не виснет,правда хрома у меня нет.

<body id="b1">

</body>
<script Language="JavaScript">
var hoverHTML='';
for (i=0;i<7;i++) {
images('./bg1.jpg',40,80);
}
document.getElementById('b1').innerHTML=hoverHTML;
function images(src,h,w) {
hoverHTML+="<img src='"+src+"' height="+h+" width="+w+" />";
}
</script>

Спустя 2 часа, 49 минут, 1 секунда (18.11.2011 - 18:37) redreem написал(а):

выложи рабочую страницу в нете.

_____________
HTML5, CSS3, jQuery, Node.js, PHP, Yii, Joomla, MySQL, MongoDb, GIMP

Быстрый ответ:

Здесь расположена полная версия этой страницы.