Bresleveloper Digital - the best at SharePoint, PowerApps and Office365, Contact us now!

opening a JQ modal in sharepoint comes with some troubles. 1st since JQ creates the modal OUTSIDE the body, initialy in order to let the modal hover over everything, it does it with some nice calculations. but with SP CSS's and HTML structure that doesn't work well, and sometimes you just don't see the modal, and sometimes you see it wierd. in some cases the JQModal appendTo Property can do the job, but sometimes the best way is to give up jQuery's calculations and just fix the modal's position' and it can be done like that, using destroy since some calculations must be done again while position is not fixed: $( function HP_ready() {     $( ".popup" ).on( "click" , function HPs_popupClick() {         $( ".salaryPopup" , this ).dialog({             bgiframe: true ,             width: 965,    ...

so lets talk about the Sharepoint Modal Dialog, the one that comes form SP.UI.ModalDialog part 1 - why not to use the jquery modal that is simple, jquery modal looks to put an overlay on the screen, and its almost impossible to fix it with sharepoint for the multiple wrapping elements, good luck with that. part 2 - but jquery modal is better, easier, and easier to use and customize you're right. so go solve part 1. or try part 3. part 3 - how to easily use SP modal's easy, and more like JQ's well the most easy way is to prepare a div element with everything you need inside and let the dialog execute on it, for example (note that "html" mean HTMLElement, not html text...): < div style =" display : none">     < div class ="divForModal" title ="Happy Dialog">       < img src ="../mouseovericon.png">       <!-- and all other content --> ...