Quick tip: Add fancybox popups to all your scaled images in 2SXC

Nov 5, 2014 at 12:23 PM
Hi

Here is a piece of script to quickly add a lightbox to all your images ( you need to include fancybox in your skin first ) http://fancyapps.com/fancybox/

Add the following in the bottom of your ascx skin. This will go through all of your images that have mode in the src ( and are not part of a link ) and then links each of them to the full image in fancybox
<script>

$(document).ready(function () {

        $(".DnnModule img[src*='?mode']").not("a img").each(function (index, value) {
            var smallUrl = $(this).attr("src");
            var fullUrl = smallUrl.substr(0, smallUrl.indexOf('?'));
            $(this).wrap("<a rel='gallery-<%=PortalSettings.ActiveTab.TabID%>' href='" + fullUrl + "' class='fancybox'/>");
        });

     
            $(".fancybox").fancybox();
})();
</script>
Coordinator
Nov 11, 2014 at 1:00 PM
Thanks for sharing :)!