2011-02-10 2 views
1

enter image description hereПомощь с изменением размеров изображения в контейнере

Ok, так что я просто пытаюсь изменить размер DIV правильно и иметь изображение внутри его размер, а также.

Ниже приведен пример контейнера и изображений, которые генерируются динамически:

<div id="imgD' + i + '" style="border:1px solid red;display:inline-block;position:absolute;"> 
    <img alt="Big" id="imgA' + i + '" width="' + Math.round(resourceData[i][2] * currentScale) + '" height="' + Math.round(resourceData[i][3] * currentScale) + '" src="' + uploadFolder + '/' + imgData[resourceData[i][1]][1] + '" /> 
</div> 

Затем изображение Jquery изменяемым добавлено на него, и контейнер имеет перетаскиваемый добавил на него. Все работает нормально. пока я не попытаюсь изменить размер обоих элементов, когда клиент «масштабируется».

Вот мой код изменения размера:

 $('#imgD' + i).css("width", (resourceData[i][2]*currentScale)); 
     $('#imgD' + i).css("height", (resourceData[i][3]*currentScale)); 

     // Lets try every combination, like a hero! 
     $('#imgA' + i).css("width", (resourceData[i][2]*currentScale)); 
     $('#imgA' + i).css("height", (resourceData[i][3]*currentScale)); 
     $('#imgA' + i).attr("width", (resourceData[i][2]*currentScale)); 
     $('#imgA' + i).attr("height", (resourceData[i][3]*currentScale)); 

     $('#imgD' + i).css("left",(resourceData[i][4]*currentScale) + "px"); 
     $('#imgD' + i).css("top", (resourceData[i][5]*currentScale) + "px"); 

значок изменения размера, что в правом нижнем углу изображения будет указать, что это проблема, связанная с JQuery изменяемыми?

ответ

2

У меня нет ответа, я боюсь, но вы можете оптимизировать ваш код совсем немного, приковав методы для элемента, например, так:

 $('#imgD' + i).css({ width: (resourceData[i][2]*currentScale), 
          height: (resourceData[i][3]*currentScale)}); 
// Lets try every combination, like a hero! 
    $('#imgA' + i).css({ width: (resourceData[i][2]*currentScale), 
          height: (resourceData[i][3]*currentScale)}) 
        .attr({ width: (resourceData[i][2]*currentScale), 
          height: (resourceData[i][3]*currentScale)}); 
    $('#imgD' + i).css({ left: (resourceData[i][4]*currentScale) + "px", 
          top: (resourceData[i][5]*currentScale) + "px"}); 
+0

Я уверен, что вы это знаете, но другие, которые смотрят эту публикацию, не могут. – Neil

0

resiable Jquery добавляет к DIV изображение.

('#imgA' + i).parent().css("width", (resourceData[i][2]*currentScale)); 
$('#imgA' + i).parent().css("height", (resourceData[i][3]*currentScale)); 
$('#imgA' + i).css("width", (resourceData[i][2]*currentScale)); 
$('#imgA' + i).css("height", (resourceData[i][3]*currentScale)); 

Используйте родительский селектор, чтобы изменить размер этого div.

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