use jQuery Modal instead of SharePoint modal

Question

So I understand this is a strange question, but is there a way to use content displayed in a SharePoint modal, in a jQuery modal instead. I like the styling jQuery offers, but the SharePoint modal comes from a CQWP link. I basically just modified the CQWP template to include

<a href="{$SafeLinkUrl}" title="{@LinkToolTip}" class="ModalDialog">

and then simply added the following jQuery to the page via CEWP

$(document).ready(function(){
    var itemLink = "";
    $("a.ModalDialog").click(function(event){ 
        event.preventDefault();
        itemLink = $(this).attr('href'); 
        openModalDialog(itemLink);
    });
});

function openModalDialog(itemLink) {
    var options = {
        url: itemLink,
        width: 800,
        height: 600,
    };
SP.UI.ModalDialog.showModalDialog(options);
} 

I am curious as to whether or not I can extract specifics via the ItemStyle, or even here and through it into a jQuery modal instead. I have learned the modal pieces in a very simple format with using divs and such, so I understand that I could write queries in order to get the data, load the divs, create my own links, etc but I would really like to get there through this modified CQWP if that is possible/feasible...

End goal is to get rid of the ribbon, handle my own events with buttons and show only the content I wish to show in the modal, but still use the CQWP on the page and links to open the modal display.

Does this make sense? Appreciate any help or advice as always guys! Thanks

Answer 1

You could attempt to add your own JavaScript to each page that overrides the "SP.UI.ModalDialog.showModalDialog" function. Something like:

SP.UI.ModalDialog.showModalDialog = function (options) {

}

Don't know how reliable it would be, but it is an option.