CustomBox Multiple Modal Targets

HTML

<section id="portfolioContainer">
	<div class="portfolioItem">
  lqksdjfmlqskd
    </div>
	<div class="portfolioItem">
    </div>
	<div class="portfolioItem">
    </div>
	<div class="portfolioItem">
  qdsfqsdfqdsfqdsf
    </div>
	<div class="portfolioItem">
    </div>
	<div class="portfolioItem">
    </div>
	<div class="portfolim">
    </div>
    <div class="portfolioItem">
    </div>
    <div class="portfolioItem">
    </div>
    <div class="portfolioItem">
    </div>
    <div class="portfolioItem">
    </div>
    <div class="portfolioItem">
    </div>
</section>
<div id="modal">Tsy misy oe mitest</div>

CSS

body {background-color:#4d4d4d;}

#portfolioContainer {width:100%; max-width:1000px; margin:0 auto; text-align:left;}
.portfolioItem {width:100px; height:100px; display:inline-block; border:solid 1px #F00; box-sizing:border-box; margin:10px; background-color:#FFF; opacity:0;}
.portfolioItem:hover {background-color:rgba(0,0,0,0.19); cursor:zoom-in;}


#modal {display:none; background-color:#ccc; width:80%; min-height:500px; padding:20px;}

/* CUSTOM BOX CSS*/
/*
 ----------------------------
 Actions
 ----------------------------
 */
.custombox-open,
.custombox-open body {
    overflow: hidden;
}
.custombox-perspective,
.custombox-perspective body  {
    perspective: 600px;
    height: 100%;
}
.custombox-overlay-open {
    visibility: visible;
    opacity: 1;
}

/*
 ----------------------------
 Defaults
 ----------------------------
 */
.custombox-overlay {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    position: fixed;
    transition-delay: 0s;
}
.custombox-overlay-default {
    transition-timing-function: linear;
    transition-property: opacity;
    opacity: 0;
}
.custombox-modal-wrapper {
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    outline: 0 none;
    overflow: auto;
    position: fixed;
    text-align: center;
}
.custombox-modal-container {
    margin: 0 auto;
    position: relative;
}
.custombox-modal img {
    max-width: 100%;
    height: auto;
}

/*
 ----------------------------
 Overlay: Letmein
 ----------------------------
 */
.custombox-overlay-letmein {
    transition-property: all;
    transition-timing-function: ease;
    visibility: hidden;
}
.custombox-overlay-open.custombox-overlay-letmein {
    transform: rotateX(-2deg);
    transform-origin: 50% 0;
    transform-style: preserve-3d;
    visibility: visible;
    opacity: 1;
}

/*
 ----------------------------
 Overlay: Slide together
 ----------------------------
 */
.custombox-overlay-slidetogether {
    transform: translateY(-100%);
    transition-property: transform...

JavaScript

$(document).ready(function(){
	$('.portfolioItem').each(function(i) {
		$(this).delay(100*(i+1)).fadeTo(500,1);
	})
});


$(document).ready(function(){
    $('.portfolioItem').on('click', function ( e ) {
        Custombox.open({
            target: '#modal',
            effect: 'fadein'
        });
        e.preventDefault();
    });
});

//CUSTOM BOX CODE//
var Custombox = (function ( w, d, h ) {
    'use strict';
    /*
     ----------------------------
     Cache
     ----------------------------
     */
    var _cache = {
        create:     document.createElement, // Performance call create.
        settings:   [],                     // Storage settings.
        overlay:    [],                     // Storage of the overlay.
        wrapper:    [],                     // Storage the wrapper.
        container:  [],                     // Storage the container of the modal.
        modal:      [],                     // Storage the modal.
        content:    [],                     // Storage the content of the modal.
        inline:     [],                     // Storage the element inline.
        size:       [],                     // Storage the size of the modal.
        close:      [],                     // Storage the callback open.
        open:       [],                     // Storage the callback open.
        scroll:     [],                     // Storage the position of top.
        display:    [],                     // Storage if the element is hidden.
        item:       -1                      // Number the modals.
    },
    /*
     ----------------------------
     Settings
     ----------------------------
     */
    _defaults = {
        target:         null,               // Set the URL, ID or Class.
        id:             null,               // Set the ID for the modal.
        cache:          false,              // If set to false, it will force requested pages not to be cached by the browser only when send by AJAX.
        escKey: ...