EaselJS HTML5 Canvas Resim Kolaj

HTML5 destekli tarayıcılar ile uyumludur.

Css & Script

    .collage-section{
      -webkit-user-select: none; /* Chrome all / Safari all */
      -moz-user-select: none; /* Firefox all */
      -ms-user-select: none; /* IE 10+ */
      /* No support for these yet, use at own risk */
      -o-user-select: none;
      user-select: none;

    }
    .collage-section.loading{
       display:none; /* ANİMASYON EKLEYEBİLİRSİNİZ */
    }

    #collage{
      width:1170px;
      height:550px;
      -webkit-mask-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC'); /* CHROME canvas maskeleme sorununun çözümü içindir */
      border-radius:6px;
    }
    @media (min-width:1001px) and (max-width:1200px){
      #collage{
        width:1170px;
      }
    }
    @media (min-width:768px) and (max-width:1000px){
      #collage{
        width:768px;
        height:361px;
      }
    }
    @media (min-width:480px) and (max-width:767px){
      #collage{
        width:480px;
        height:149px;
      }
    }
    @media (max-width:479px){
      #collage{
        display:none;
        height:0;
      }
    }
  
    $(document).ready(function(){
    
       canvas_collage();
       
    });