[$] Pr1v473 xHeEl B4ckD00RzZ [$]

Current Path : D:/InetPub/vhosts/kuccs.com.kw/httpdocs/PortalCMS/scripts/editor/scripts/saf/
Upload File
Current File : D:/InetPub/vhosts/kuccs.com.kw/httpdocs/PortalCMS/scripts/editor/scripts/saf/image.htm

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="../style/editor.css" rel="stylesheet" type="text/css">
<script>
  var sLangDir=parent.oUtil.langDir;
  document.write("<scr"+"ipt src='../language/"+sLangDir+"/image.js'></scr"+"ipt>");
</script>
<script>writeTitle()</script>
<script>

//parameter for popup window, since standard window.open doesn't support parameter
var dialogArgument;

function doWindowFocus()
    {
    parent.oUtil.onSelectionChanged=new Function("realTime()");
    }
function bodyOnLoad()
    {
    loadTxt();

    window.onfocus=doWindowFocus;
    parent.oUtil.onSelectionChanged=new Function("realTime()");

    if(parent.oUtil.obj.cmdAssetManager!="") document.getElementById("btnAsset").style.display="block";
    if(parent.oUtil.obj.cmdImageManager!="") document.getElementById("btnAsset").style.display="block";

    realTime()
    }

function bodyOnUnload() {
  parent.oUtil.onSelectionChanged=null;
}

function openAsset()
    {
    if(parent.oUtil.obj.cmdAssetManager!="")
    eval(parent.oUtil.obj.cmdAssetManager);
  if(parent.oUtil.obj.cmdImageManager!="")
    eval(parent.oUtil.obj.cmdImageManager);
    }
function setAssetValue(v)
    {
    document.getElementById("inpImgURL").value = v;
    }

function modalDialogShow(url,width,height)
    {
    parent.modalDialogShow(url,width,height, window);
    }

function modelessDialogShow(url,width,height)
    {
    var left = screen.availWidth/2 - width/2;
    var top = screen.availHeight/2 - height/2;
    window.open(url, "", "dependent=yes,width="+width+"px,height="+height+",left="+left+",top="+top);
    }


function realTime()
    {

    var idImg = document.getElementById("idImg");
    var inpImgURL = document.getElementById("inpImgURL");

    var inpImgAlt = document.getElementById("inpImgAlt");
    var inpImgAlign = document.getElementById("inpImgAlign");

    var inpImgTop = document.getElementById("inpImgTop");
    var inpImgBottom = document.getElementById("inpImgBottom");
    var inpImgLeft = document.getElementById("inpImgLeft");
    var inpImgRight = document.getElementById("inpImgRight");

    var inpImgWidth = document.getElementById("inpImgWidth");
    var inpImgHeight = document.getElementById("inpImgHeight");

    var btnApply = document.getElementById("btnApply");
    var btnOk = document.getElementById("btnOk");
    var btnInsert = document.getElementById("btnInsert");

    var oEditor=parent.oUtil.oEditor;
    var oSel=oEditor.getSelection();
    var oElement = parent.getSelectedElement(oSel);

    clearAllProperties()

    if(oElement.tagName=="IMG")
        {

        //var range = oEditor.document.createRange();
        //range.selectNodeContents(oElement);
        //oSel = oEditor.getSelection();
        //oSel.removeAllRanges();
        //oSel.addRange(range);

        inpImgURL.value=oElement.getAttribute("src");

        inpImgAlt.value = oElement.getAttribute("title");
        inpImgAlt.value = oElement.getAttribute("alt");

        inpImgAlign.value = oElement.getAttribute("align");

        idImg.style.borderTop=oElement.style.borderTop;
        idImg.style.borderBottom=oElement.style.borderBottom;
        idImg.style.borderLeft=oElement.style.borderLeft;
        idImg.style.borderRight=oElement.style.borderRight;

        inpImgWidth.value = oElement.width;
        inpImgHeight.value = oElement.height;

        if(oElement.style.marginTop.substr(oElement.style.marginTop.length-2,2)=="px")
            inpImgTop.value=oElement.style.marginTop.substr(0,oElement.style.marginTop.length-2);
        else inpImgTop.value="";

        if(oElement.style.marginBottom.substr(oElement.style.marginBottom.length-2,2)=="px")
            inpImgBottom.value=oElement.style.marginBottom.substr(0,oElement.style.marginBottom.length-2);
        else inpImgBottom.value="";

        if(oElement.style.marginLeft.substr(oElement.style.marginLeft.length-2,2)=="px")
            inpImgLeft.value=oElement.style.marginLeft.substr(0,oElement.style.marginLeft.length-2);
        else inpImgLeft.value="";

        if(oElement.style.marginRight.substr(oElement.style.marginRight.length-2,2)=="px")
            inpImgRight.value=oElement.style.marginRight.substr(0,oElement.style.marginRight.length-2);
        else inpImgRight.value="";

        btnApply.style.display="block";
        btnOk.style.display="block";
        btnInsert.style.display="none";

        doPreview();
        }
    else
        {
        btnApply.style.display="none";
        btnOk.style.display="none";
        btnInsert.style.display="block";
        }

    }

function clearAllProperties()
    {
    document.getElementById("inpImgURL").value="";//always updated
    document.getElementById("inpImgAlt").value="";//not set, krn tdk harus
    document.getElementById("inpImgAlign").value="";
    document.getElementById("inpImgWidth").value="";
    document.getElementById("inpImgHeight").value="";
    document.getElementById("inpImgTop").value="";
    document.getElementById("inpImgBottom").value="";
    document.getElementById("inpImgLeft").value="";
    document.getElementById("inpImgRight").value="";
    }

function doPreview()
    {
    var idImg = document.getElementById("idImg");
    var inpImgAlt = document.getElementById("inpImgAlt");
    var inpImgAlign = document.getElementById("inpImgAlign");

    var inpImgTop = document.getElementById("inpImgTop");
    var inpImgBottom = document.getElementById("inpImgBottom");
    var inpImgLeft = document.getElementById("inpImgLeft");
    var inpImgRight = document.getElementById("inpImgRight");

    idImg.style.width="";
    idImg.style.height="";

    //idImg.title=inpImgAlt.value;
    idImg.alt=inpImgAlt.value;

    idImg.setAttribute("ALIGN", inpImgAlign.value);

    if(inpImgTop.value!="")idImg.style.marginTop=inpImgTop.value;
    else idImg.style.marginTop="";
    if(inpImgBottom.value!="")idImg.style.marginBottom=inpImgBottom.value;
    else idImg.style.marginBottom="";
    if(inpImgLeft.value!="")idImg.style.marginLeft=inpImgLeft.value;
    else idImg.style.marginLeft="";
    if(inpImgRight.value!="")idImg.style.marginRight=inpImgRight.value;
    else idImg.style.marginRight="";
    }

function doInsert()
    {
    var idImg = document.getElementById("idImg");
    var inpImgURL = document.getElementById("inpImgURL");

    var inpImgAlt = document.getElementById("inpImgAlt");
    var inpImgAlign = document.getElementById("inpImgAlign");

    var inpImgTop = document.getElementById("inpImgTop");
    var inpImgBottom = document.getElementById("inpImgBottom");
    var inpImgLeft = document.getElementById("inpImgLeft");
    var inpImgRight = document.getElementById("inpImgRight");

    var inpImgWidth = document.getElementById("inpImgWidth");
    var inpImgHeight = document.getElementById("inpImgHeight");

    parent.oUtil.obj.saveForUndo();

    var sImgAlt=inpImgAlt.value;
    var sImgAlign=inpImgAlign.value;

    var sImgBorderTop=idImg.style.borderTop;
    var sImgBorderBottom=idImg.style.borderBottom;
    var sImgBorderLeft=idImg.style.borderLeft;
    var sImgBorderRight=idImg.style.borderRight;

    var bNoBorder=false;
    if((idImg.style.borderTopStyle=="none"||idImg.style.borderTop=="")&&
        (idImg.style.borderBottomStyle=="none"||idImg.style.borderBottom=="")&&
        (idImg.style.borderLeftStyle=="none"||idImg.style.borderLeft=="")&&
        (idImg.style.borderRightStyle=="none"||idImg.style.borderRight==""))
        bNoBorder=true;

    var sImgWidth=inpImgWidth.value;
    var sImgHeight=inpImgHeight.value;
    var sImgTop=inpImgTop.value;
    var sImgBottom=inpImgBottom.value;
    var sImgLeft=inpImgLeft.value;
    var sImgRight=inpImgRight.value;


    var oEditor=parent.oUtil.oEditor;
    var oSel=oEditor.getSelection();

    oSel.collapseToStart();
    var range = oSel.getRangeAt(0);
    var oElement = oEditor.document.createElement("IMG");
    oElement.src = inpImgURL.value;
    range.insertNode(oElement);
    range.selectNode(oElement);
    oSel.removeAllRanges();
    oSel.addRange(range);

    parent.realTime(parent.oUtil.obj);

    if (oElement.tagName=="IMG")
        {
        oElement.setAttribute("TITLE", sImgAlt);
        oElement.setAttribute("ALT", sImgAlt);

        if(sImgAlign!="") oElement.setAttribute("ALIGN", sImgAlign);

        if(bNoBorder) {
            //oElement.border="0px";
            oElement.style.border = null;
        } else
            {
            oElement.style.borderTop=idImg.style.borderTopColor + " " + idImg.style.borderTopWidth + " " + idImg.style.borderTopStyle;
            oElement.style.borderBottom=idImg.style.borderBottomColor + " " + idImg.style.borderBottomWidth + " " + idImg.style.borderBottomStyle;
            oElement.style.borderLeft=idImg.style.borderLeftColor + " " + idImg.style.borderLeftWidth + " " + idImg.style.borderLeftStyle;;
            oElement.style.borderRight=idImg.style.borderRightColor + " " + idImg.style.borderRightWidth + " " + idImg.style.borderRightStyle;;
            }

        if(sImgWidth!="")oElement.setAttribute("WIDTH", sImgWidth);
        if(sImgHeight!="")oElement.setAttribute("HEIGHT", sImgHeight);
        if(sImgTop!="")oElement.style.marginTop=sImgTop + "px";
        if(sImgBottom!="")oElement.style.marginBottom=sImgBottom + "px";
        if(sImgLeft!="")oElement.style.marginLeft=sImgLeft + "px";
        if(sImgRight!="")oElement.style.marginRight=sImgRight + "px";
        }
    self.close()
    }

function doUpdate()
    {
    var idImg = document.getElementById("idImg");
    var inpImgURL = document.getElementById("inpImgURL");

    var inpImgAlt = document.getElementById("inpImgAlt");
    var inpImgAlign = document.getElementById("inpImgAlign");

    var inpImgTop = document.getElementById("inpImgTop");
    var inpImgBottom = document.getElementById("inpImgBottom");
    var inpImgLeft = document.getElementById("inpImgLeft");
    var inpImgRight = document.getElementById("inpImgRight");

    var inpImgWidth = document.getElementById("inpImgWidth");
    var inpImgHeight = document.getElementById("inpImgHeight");

    var oEditor=parent.oUtil.oEditor;
    var oSel=oEditor.getSelection();

    var oElement = parent.getSelectedElement(oSel);

    if (oElement.tagName=="IMG")
        {
        parent.oUtil.obj.saveForUndo();

        oElement.setAttribute("SRC", inpImgURL.value);

        oElement.setAttribute("TITLE", inpImgAlt.value);
        oElement.setAttribute("ALT", inpImgAlt.value);

        if(inpImgAlign.value!="") {
        	oElement.setAttribute("align", inpImgAlign.value);
        } else {
        	oElement.removeAttribute("align");
        }

        //oElement.style.borderTop=idImg.style.borderTop;
        //oElement.style.borderBottom=idImg.style.borderBottom;
        //oElement.style.borderLeft=idImg.style.borderLeft;
        //oElement.style.borderRight=idImg.style.borderRight;

        oElement.style.borderTop=idImg.style.borderTopColor + " " + idImg.style.borderTopWidth + " " + idImg.style.borderTopStyle;
        oElement.style.borderBottom=idImg.style.borderBottomColor + " " + idImg.style.borderBottomWidth + " " + idImg.style.borderBottomStyle;
        oElement.style.borderLeft=idImg.style.borderLeftColor + " " + idImg.style.borderLeftWidth + " " + idImg.style.borderLeftStyle;;
        oElement.style.borderRight=idImg.style.borderRightColor + " " + idImg.style.borderRightWidth + " " + idImg.style.borderRightStyle;;


        if(idImg.style.borderTopStyle!="none"||
            idImg.style.borderBottomStyle!="none"||
            idImg.style.borderLeftStyle!="none"||
            idImg.style.borderRightStyle!="none")
            oElement.removeAttribute("border",0);
        if((idImg.style.borderTopStyle=="none"||idImg.style.borderTop=="")&&
            (idImg.style.borderBottomStyle=="none"||idImg.style.borderBottom=="")&&
            (idImg.style.borderLeftStyle=="none"||idImg.style.borderLeft=="")&&
            (idImg.style.borderRightStyle=="none"||idImg.style.borderRight=="")) {
            //oElement.border=0;
            oElement.style.border = null;
        }

        //clean
        if(idImg.style.borderTop=="medium none"||idImg.style.borderTopStyle=="none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: medium none","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopColor+" "+idImg.style.borderTopWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopColor+" "+idImg.style.borderTopWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopColor+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: "+idImg.style.borderTopColor,"");
            }
        if(idImg.style.borderBottom=="medium none"||idImg.style.borderBottomStyle=="none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: medium none","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomColor+" "+idImg.style.borderBottomWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomColor+" "+idImg.style.borderBottomWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomColor+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: "+idImg.style.borderBottomColor,"");
            }
        if(idImg.style.borderLeft=="medium none"||idImg.style.borderLeftStyle=="none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: medium none","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftColor+" "+idImg.style.borderLeftWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftColor+" "+idImg.style.borderLeftWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftColor+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: "+idImg.style.borderLeftColor,"");
            }
        if(idImg.style.borderRight=="medium none"||idImg.style.borderRightStyle=="none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: medium none","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightColor+" "+idImg.style.borderRightWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightColor+" "+idImg.style.borderRightWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightWidth+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightWidth,"");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightColor+"; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: "+idImg.style.borderRightColor,"");
            }
        /*
        //clean
        if(idImg.style.borderTop=="medium none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-TOP: medium none","");
            }
        if(idImg.style.borderBottom=="medium none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-BOTTOM: medium none","");
            }
        if(idImg.style.borderLeft=="medium none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-LEFT: medium none","");
            }
        if(idImg.style.borderRight=="medium none")
            {
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: medium none; ","");
            oElement.style.cssText=oElement.style.cssText.replace("BORDER-RIGHT: medium none","");
            }
        */

        oElement.style.width="";
        oElement.style.height="";
        if(inpImgWidth.value!="")oElement.setAttribute("WIDTH", inpImgWidth.value+"px");
        else oElement.removeAttribute("WIDTH",0);
        if(inpImgHeight.value!="")oElement.setAttribute("HEIGHT", inpImgHeight.value+"px");
        else oElement.removeAttribute("HEIGHT",0);

        if(inpImgTop.value!="")oElement.style.marginTop=inpImgTop.value + "px";
        else oElement.style.marginTop="";
        if(inpImgBottom.value!="")oElement.style.marginBottom=inpImgBottom.value + "px";
        else oElement.style.marginBottom="";
        if(inpImgLeft.value!="")oElement.style.marginLeft=inpImgLeft.value + "px";
        else oElement.style.marginLeft="";
        if(inpImgRight.value!="")oElement.style.marginRight=inpImgRight.value + "px";
        else oElement.style.marginRight="";
        }

    window.focus();
    }

function resetImageSize()
    {

    var oEditor=parent.oUtil.oEditor;
    var oSel=oEditor.getSelection();
    var oElement = parent.getSelectedElement(oSel);

    if (oElement.tagName=="IMG")
        {
        parent.oUtil.obj.saveForUndo();

        oElement.style.width="";
        oElement.style.height="";
        oElement.removeAttribute("WIDTH",0);
        oElement.removeAttribute("HEIGHT",0);
        realTime();
        }
    }

function openBorder() {
  dialogArgument=['', 'openerWin.document.getElementById(\'idImg\')'];
  modalDialogShow(parent.oUtil.obj.scriptPath + 'border.htm', 460, 240);
}

</script>
</head>
<body style="overflow:hidden;">

<table width=100% height=100% align=center cellpadding=0 cellspacing=0>
<tr>
<td valign=top style="padding:5;height:100%">

    <table width=100%>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Source</span>:
        </td>
        <td colspan=4 style="width:100%">
                <table cellpadding="0" cellspacing="0" style="width:100%">
                <tr>
                <td style="width:100%"><input type="text" id="inpImgURL" name=inpImgURL style="width:100%" class="inpTxt"></td>
                <td><input type="button" value="" onclick="openAsset()" id="btnAsset" name="btnAsset" style="display:none;background:url('openAsset.gif');width:20px;height:16px;border:#a5acb2 1px solid;margin-left:3px;"></td>
                </tr>
                </table>
        </td>
    </tr>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Title</span>:&nbsp;
        </td>
        <td width="100%">
                <input type="text" id="inpImgAlt" name=inpImgAlt style="width:150px" class="inpTxt" onkeyup="doPreview()">
        </td>
        <td rowspan="5" style="padding-top:4;padding-right:7">
            <div style="height:112px;border-left:#c7c7c7 1 solid;width:1px"></div>
        </td>
        <td>
                <span id="txtLang" name="txtLang">Spacing</span>:&nbsp;
        </td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Alignment</span>:
        </td>
        <td nowrap>
                <select id="inpImgAlign" name="inpImgAlign" style="width:150px" class="inpSel" onchange="doPreview()">
                <option value="" selected></option><!-- &lt;Not Set&gt; -->
                <option value="absBottom" id="optLang" name="optLang">absBottom</option>
                <option value="absMiddle" id="optLang" name="optLang">absMiddle</option>
                <option value="baseline" id="optLang" name="optLang">baseline</option>
                <option value="bottom" id="optLang" name="optLang">bottom</option>
                <option value="left" id="optLang" name="optLang">left</option>
                <option value="middle" id="optLang" name="optLang">middle</option>
                <option value="right" id="optLang" name="optLang">right</option>
                <option value="textTop" id="optLang" name="optLang">textTop</option>
                <option value="top" id="optLang" name="optLang">top</option>
                </select>&nbsp;
        </td>
        <td nowrap>
                <span id="txtLang" name="txtLang">Top</span>:&nbsp;
        </td>
        <td nowrap>
                <input type="text" name="inpImgTop" id="inpImgTop" size=2 class="inpTxt" onkeyup="doPreview()"> &nbsp;px
        </td>
    </tr>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Border</span>:
        </td>
        <td nowrap>
            <input type="button" name=btnBorder id=btnBorder value=" Border Style " style="width:150px"
            onclick="openBorder()" />
        </td>
        <td nowrap>
                <span id="txtLang" name="txtLang">Bottom</span>:
        </td>
        <td nowrap>
                <input type="text" name="inpImgBottom" id="inpImgBottom" size=2 class="inpTxt" onkeyup="doPreview()"> &nbsp;px
        </td>
    </tr>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Width</span>:
        </td>
        <td nowrap rowspan="2">
                <table cellpadding="0" cellspacing="0">
                <tr>
                <td>
                <input type="text" name="inpImgWidth" id="inpImgWidth" size=2 class="inpTxt"> &nbsp;px
                </td>
                <td rowspan="2" height="50" style="padding-left:3;padding-top:6">
                    <img src="img_reset.gif" align=left width="13" height="28">
                </td>
                <td rowspan="2" height="50" style="padding-top:7">
                    <input type="button" name="btnReset" id="btnReset" value="reset" onclick="resetImageSize()">
                </td>
                </tr>
                <tr>
                <td>
                <input type="text" name="inpImgHeight" id="inpImgHeight" size=2 class="inpTxt"> &nbsp;px
                </td>
                </tr>
                </table>
        </td>
        <td nowrap>
                <span id="txtLang" name="txtLang">Left</span>:
        </td>
        <td nowrap>
                <input type="text" name="inpImgLeft" id="inpImgLeft" size=2 class="inpTxt" onkeyup="doPreview()" id="Text2"> &nbsp;px
        </td>
    </tr>
    <tr>
        <td nowrap>
                <span id="txtLang" name="txtLang">Height</span>:
        </td>

        <td nowrap>
                <span id="txtLang" name="txtLang">Right</span>:
        </td>
        <td nowrap>
                <input type="text" name="inpImgRight" id="inpImgRight" size=2 class="inpTxt" onkeyup="doPreview()" id="Text1"> &nbsp;px
        </td>
    </tr>

    <tr>
        <td colspan="5">
            <div style="padding:3;">
            <div id="divPreview" style="padding:5;padding-left:5;overflow:auto;border:1 dimgray solid;height:85;background:#ffffff">
<img src="img.gif" id="idImg" align=left width="53" height="51">Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et
dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo
duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

            </div>
            </div>
        </td>
    </tr>
    </table>

</td>
</tr>
<tr>
<td class="dialogFooter" align="right">
    <table cellpadding=0 cellspacing=0>
    <tr>
    <td>
    <input type="button" name=btnCancel id=btnCancel value="cancel" onclick="self.close()" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
    </td>
    <td>
    <input type="button" name=btnInsert id=btnInsert value="insert" onclick="doInsert()" style="display:block" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
    </td>
    <td>
    <input type="button" name=btnApply id=btnApply value="apply" onclick="doUpdate()" style="display:none" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
    </td>
    <td>
    <input type="button" name=btnOk id=btnOk value=" ok " onclick="doUpdate();self.close()" style="display:none;" class="inpBtn" onmouseover="this.className='inpBtnOver';" onmouseout="this.className='inpBtnOut'">
    </td>
    </tr>
    </table>
</td>
</tr>
</table>

</body>
</html>