cant seem to move image pt2

pt 2

[CODE]
DhtmlLayer.prototype.show = function()
{
this.getLayer().style.visibility = ‘visible’;
if (this.isIframeEnabled()) {
this.getIframe().style.visibility = ‘visible’;
}
}

DhtmlLayer.prototype.setCssClass = function(cssClass) {
this.cssClass = cssClass;
}

DhtmlLayer.prototype.setCssFile = function(cssFile) {
this.cssFile = cssFile;
}

DhtmlLayer.prototype.setIcon = function(imgIcon) {
this.imgIcon = imgIcon;
}

DhtmlLayer.prototype.setHTML = function(html)
{
this.getLayer().innerHTML = html;
}

DhtmlLayer.prototype.addHTML = function(html)
{
this.getLayer().innerHTML += html;
}

DhtmlLayer.prototype.setOffsetX = function(Xoffset)
{
this.offsetX = Xoffset;
}

DhtmlLayer.prototype.setOffsetY = function(Yoffset)
{
this.offsetY = Yoffset;
}

DhtmlLayer.prototype.setLayerPosition = function(x, y)
{
this.getLayer().style.top = (y + this.offsetY) + ‘px’;
this.getLayer().style.left = (x + this.offsetX) + ‘px’;
if (this.isIframeEnabled()) {
this.getIframe().style.top = (y + this.offsetY) + ‘px’;
this.getIframe().style.left = (x + this.offsetX) + ‘px’;
}
}

DhtmlLayer.prototype.setLayerDimension = function(width, height)
{
this.getLayer().style.width = width;
this.getLayer().style.height = height;
if (this.isIframeEnabled()) {
this.getIframe().style.width = width;
this.getIframe().style.height = height;
}
}

DhtmlLayer.prototype.getLayer = function()
{
return document.getElementById(this.layerId);
}

DhtmlLayer.prototype.writeIframe = function()
{
if (document.all) {
var iframe = document.createElement(‘iframe’);
iframe.setAttribute(‘src’, ‘javascript:;’);
iframe.setAttribute(‘id’, this.layerID + ‘_iframe’);
iframe.setAttribute(‘frameborder’, ‘0’);
iframe.setAttribute(‘scrolling’, ‘no’);
var layer = this.getLayer();
iframe.style.width = layer.style.width;
iframe.style.height = layer.style.height;
iframe.style.zIndex = layer.style.zIndex – 1;
iframe.style.visibility = ‘hidden’;
iframe.style.position = ‘absolute’;
layer.parentNode.insertBefore(iframe, layer);
}
}
DhtmlLayer.prototype.getIframe = function()
{
return document.getElementById(this.layerID+’_iframe’);
}

DhtmlLayer.prototype.isIframeEnabled = function()
{
return (document.all && this.getIframe() && this.getLayer().style.width != ”);
}

// Capture events within the popup layer
if (document.layers) { // Netscape
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = captureMousePosition;
} else if (document.all) { // Internet Explorer
document.onmousemove = captureMousePosition;
} else if (document.getElementById) { // Netcsape 6
document.onmousemove = captureMousePosition;
}
function captureMousePosition(e) {
if (document.layers) {
__calMouseXPos = e.pageX;
__calMouseYPos = e.pageY;
} else if (document.all) {
__calMouseXPos = window.event.x+document.body.scrollLeft;
__calMouseYPos = window.event.y+document.body.scrollTop;
} else if (document.getElementById) {
__calMouseXPos = e.pageX;
__calMouseYPos = e.pageY;
}
}

* The ColorPicker class
*
* @author Michael Mifsud
* @site http://www.tropotek.com.au
* @package ColorPicker

* __construct
*
* @param string objName – The name you called this object.
* @param string callbackFunction – The function that gets called when an event occurs.
*/
ColorPicker.Extends(DhtmlLayer);
function ColorPicker(objName) {

this.DhtmlLayer(objName); // parent::__construct

// Properties
this.callbackFunction = objName + ‘_callback’;
this.selectedColor = ‘#FFFFFF’;
this.imgIcon = ‘blank.gif’;
this.display_msg = ‘msg’; // The name of the toolbar message display element id
this.display_box = ‘box’; // The name of the toolbar color box display element id

// __construct
this.setCssClass(‘colorPicker’);
this.writeLayerDOM(document.getElementById(objName));

this.getLayer().onmouseout = this.hideEvent;
}

/**
* Writes HTML for layer, this is the clickable icon to activate the layer.
*
* @param DOMElement element
*/
ColorPicker.Override(DhtmlLayer, ‘writeIconDOM’);
ColorPicker.prototype.writeIconDOM = function()
{
element = arguments[0] ? arguments[0] : this.getLayer();
if (element == null) {
alert(‘Cannot attach to unknown element!’);
}

var a = document.createElement(‘a’);
a.setAttribute(‘href’, ‘javascript: ‘ +
this.objName + ‘.setLayerPosition(__calMouseXPos, __calMouseYPos, this);’ +
this.objName + ‘.show();’);
a.setAttribute(‘onclick’, ‘this.blur();’);
a.className = this.cssClass + ‘_icon’;
a.id = this.objName + ‘_cpIcon’;
a.style.border = ‘3px outset #666666’;

var img = document.createElement(‘img’);
img.setAttribute(‘src’, this.imgIcon);
img.setAttribute(‘width’, ’20’);
img.setAttribute(‘height’, ’20’);
img.style.border = ‘none’;

a.appendChild(img);
//element.parentNode.appendChild(a, element);
element.parentNode.insertBefore(a, element);
}

/**
* Show the div
*/
ColorPicker.Override(DhtmlLayer, ‘show’);
ColorPicker.prototype.show = function() {

var cellwidth = 20, cellheight = 20;
var maxrows = 12, maxcols = 18, padcols = 3, cellcolor = ‘#000000’;
var blockcols = 6, blockrows = 6;
var prime = [“#000000″,”#333333″,”#666666″,”#999999″,”#CCCCCC”,”#FFFFFF”,”#FF0000″,”#00FF00″,”#0000FF”,”#FFFF00″,”#00FFFF”,”#FF00FF”];

var html = ‘<table cellpadding=”0″ cellspacing=”2″ border=”0″ >’;
html += ‘<tr bgcolor=”#3399CC”><td colspan=”‘+(maxcols+padcols)+'” height=”25″>’+
‘**<span id=”‘+this.layerID+’_’+this.display_box+
‘” class=”box”>********</span>’+
‘<span id=”‘+this.layerID+’_’+this.display_msg+'” class=”msg” style=”font-size:14px;padding: 0px 5px;font-color:#000000;”><em>COLOR SELECTOR</em></span>’+
‘</td></tr>’;
for(var row = 0; row < maxrows; row++) {

html += ‘<tr>’;
for(var col = 0; col < maxcols+padcols; col++) {
// start padding cols
if (col < padcols) {
if (col == 1) {
cellcolor = prime[row];
}else{
cellcolor = cellcolor.setColor(0x00, 0x00, 0x00);
}
}else{
if (col < blockcols + padcols) {
if (row < blockrows) {
cellcolor = cellcolor.setColor(0x00, 0x33*((col-padcols)%blockcols), 0x33*row);
}else{
cellcolor = cellcolor.setColor(0x99, 0x33*((col-padcols)%blockcols), 0x33*(row-blockrows));
}
} else if (col < (blockcols*2) + padcols) {
if (row < blockrows) {
cellcolor = cellcolor.setColor(0x33, 0x33*((col-padcols)%blockcols), 0x33*row);
}else{
cellcolor = cellcolor.setColor(0xCC, 0x33*((col-padcols)%blockcols), 0x33*(row-blockrows));
}
} else if (col < (blockcols*3) + padcols) {
if (row < blockrows) {
cellcolor = cellcolor.setColor(0x66, 0x33*((col-padcols)%blockcols), 0x33*row);
}else{
cellcolor = cellcolor.setColor(0xFF, 0x33*((col-padcols)%blockcols), 0x33*(row-blockrows));
}
} else {
// Throw error
}
}
html += ‘<td width=”‘+cellwidth+'” height=”‘+cellheight+'” bgcolor=”‘+cellcolor+
‘” onmouseover=”‘+this.objName+’.setToolbar(”+cellcolor+”)” ‘+
‘onClick=”‘+this.objName+’.setColor(”+cellcolor+”);’+this.callbackFunction+'(”+cellcolor+”);’+this.objName+’.hide();”></td>’;
}
html += ‘</tr>’;
}
html += ‘</table>’;

this.setHTML(html);
// Call show() method
this.DhtmlLayer_show();
}

/**
* Set the tool bar values when the cusor hovers over a color.
*/
ColorPicker.prototype.setToolbar = function(color) {
colorBox = document.getElementById(this.layerID+’_’+this.display_box);
colorBox.style.backgroundColor = color;
msgBox = document.getElementById(this.layerID+’_’+this.display_msg);
msgBox.innerHTML = color;
}

/**
* Set the selected color
*/
ColorPicker.prototype.setColor = function(color) {
var icon = document.getElementById(this.objName + ‘_cpIcon’);
if (icon) {
icon.style.backgroundColor = color;
}
}

* Convert a hex or dec value to a hex str
* @param int Dec A hex or int value.
* @todo check for bounds errors -255 to 255 ????
*/
function Dec2Hex (Dec) {
var hexChars = “0123456789ABCDEF”;
var a = Dec % 16;
var b = (Dec – a)/16;
hex = “” + hexChars.charAt(b) + hexChars.charAt(a);
return hex;
}
/**
* This function should set a hex color value.
*
* @param hex r The red value to add
* @param hex g The green value to add
* @param hex b The blue value to add
*/
function CP_setColor(r, g, b) {
var r_str, g_str, b_str;

if (this.substr(0, 1) == ‘#’) {
// Calc Red
if (r >= 0xFF) {
r_str = Dec2Hex(0xFF);
}else if (r <= 0x00) {
r_str = Dec2Hex(0x00);
}else{
r_str = Dec2Hex(r);
}
// Calc Green
if (g >= 0xFF) {
g_str = Dec2Hex(0xFF);
}else if (g <= 0x00) {
g_str = Dec2Hex(0x00);
}else{
g_str = Dec2Hex(g);
}
// Calc Blue
if (b >= 0xFF) {
b_str = Dec2Hex(0xFF);
}else if (b <= 0x00) {
b_str = Dec2Hex(0x00);
}else{
b_str = Dec2Hex(b);
}
}
return ‘#’+r_str+g_str+b_str;
}
String.prototype.setColor = CP_setColor;

[/CODE]

Also in #JavaScript _↴