Opening Images and Pages in a Dialog / Lightbox

Opening any webpage in a dialog window (tested with SharePoint 2010).

http://pacsharepoint.com/2010/07/open-list-item-modal-dialog-lightbox.html

Note: I had to add the script using SharePoint Designer 2010 as the web editor kept removing the javascript whenever I clicked on save.

Opening an image with a Lightbox effect.

http://johnliu.net/blog/2011/5/9/sharepoint-2010-simple-lightbox-effect-for-large-images.html

Note: I had to modify John’s script a little to get this to work for me.

<script type=”text/javascript”>
$(document).ready(function () {
$(“img.ms-rteImage-LightBox”).click(function(){
SP.UI.ModalDialog.showModalDialog({
url: $(this).attr(“src”),
title: $(this).attr(“alt”)
});
});
});
</script>

Tags: , ,

4 Responses to “Opening Images and Pages in a Dialog / Lightbox”

  1. John Liu December 2, 2011 at 9:40 am #

    Glad this was helpful.
    Do you like the trick where content editors can apply the style magically?

    • Andrew Toh December 15, 2011 at 7:45 am #

      Hi John

      Yes, we used this trick for one of our projects and it was well received 🙂

  2. Filipe January 13, 2015 at 7:25 pm #

    can i open my pictures from image gallery

Trackbacks/Pingbacks

  1. Open link in SP Dialog from Global Navigation / Quick launch | My SharePoint Adventures - December 21, 2011

    […] on my previous post about opening a link in a SP dialog window (similar to lightbox), we decided to make it so that […]

Leave a Reply

%d bloggers like this: