PDA

View Full Version : draggable resizable image layering



david l
4 Aug 2009, 11:48 AM
So I have gotten images to layer on top of one another, but I would like to use an Ext.Resizable (and maybe some other elements), specifically the one in the examples page where you can drag/move the picture around and resize it

at the moment, for the images I use


var layer1 = new Ext.Layer({
constrain: true,
zindex: 5000
});
layer1.update("<img src='S1110.jpg' />");
layer1.center();
layer1.move("l",120);
layer1.show();


I have tried the following using the update and appendChild functions. I am fairly new to extjs so im thinking that I am misusing them or the Ext.Resizable itself


var layer3 = new Ext.Layer({
constrain: true,
zindex: 9000
});

var wrapped = new Ext.Resizable('wrapped', {
wrap:true,
pinned:true,
minWidth:50,
minHeight: 50,
preserveRatio: true
});

layer3.update("<img id='wrapped' src='logo3b.jpg' />");
//layer3.appendChild(wrapped);

layer3.center();
layer3.move("l",500);
layer3.show();


Any help is appreciated, thank you in advance.

david l
5 Aug 2009, 11:43 AM
nevermind, turns out that i put the ordering wrong, it seems to be working now

Animal
5 Aug 2009, 11:57 AM
Better would be



var layer1 = new Ext.Layer({
dh: { tag: 'img', src: 'S1110.jpg' },
constrain: true,
zindex: 5000
});
layer1.on("load", layer1.center);

david l
5 Aug 2009, 12:00 PM
even better, thank you, i always seem to forget about the domhelpers