JQuery Modal Dialog how to add '-' (minimize)

this is a nice trick
1st to put the '-' in out modal title bar (this is after opening the dialog):

var header = document.getElementById("divMyDialog").previousSibling;
var minusDiv = document.createElement("div");
minusDiv.innerHTML = "  -  ";
minusDiv.setAttribute("class", "divMinusForDialog")
minusDiv.setAttribute("onclick", "MinimizeDialog()")
header.appendChild(minusDiv);

also put these JS functions:
function MinimizeDialog() {
    $("#divMyDialog").dialog('close');
    $("#divDialogIsMinimized").show();
}


function MaximizeConvDialog() {
    $("#divMyDialog").dialog('open');
}
the CSS is this with extra for out maximizer:
.divMinusForDialog {
  
position: absolute;
   right: 0px;
   font-size: large;
}


#divConvIsMinimized{   display:none;
   position:fixed;
   bottom:0px;
}

and now just put something as maximizer:
<div id="divDialogIsMinimized" onclick="MaximizeDialogDialog()">
    <img src="Images/minimizedCall.jpg" width="100px" />
</div>



 

Comments

Popular posts from this blog

OverTheWire[.com] Natas Walkthrough - JUST HINT, NO SPOILERS

SOLVED The item could not be indexed successfully because the item failed in the indexing subsystem

Asp.Net Ending Response options, Response.End() vs CompleteRequest()