jQuery Isotope - 코너 스탬프 문제

Question

내 프로젝트에서 awsome JQuery Isotope 플러그인을 사용하기 시작했습니다. 모든 것이 잘 작동하지만 corner-stapm 옵션에 문제가 하나 있습니다.

내 masnory 격자의 각 요소는 너비 (220px + 5 여백) 및 임의 높이 (내용에 따라 다름)와 CSS 파일의 @media 쿼리를 사용하여 다른 화면 해상도에서 열 번호를 변경할 수 있습니다 230, 460, 690 .. 등). 코너 스탬프

문제는 가장 좁은 버전 (하나의 열)에서 발생 - 코너 스탬프 동위 원소로 덮여 ...

같은 문제는이 데모 동위 공식 페이지에 발생 http://isotope.metafizzy.co/custom-layout-modes/masonry-corner-stamp.html 창 인 (때에 큰 동그라미가 다른 동위 원소 요소 뒤에 숨어 있음).

Masnory 플러그인 데모 사이트에서와 같이 제대로 작동한다는 것을 알았습니다! http://masonry.desandro.com/demos/corner-stamp.html

이미 동위 원소에 Masnory에서 사이트 스크립트를 복사하기 위해 결합하지했지만, 행운과 나는 JS/jQuery를에 더 너무 좋은 생각과 같이/

이 동위 원소에서 작업하도록 좋은 것 내 사이트에 필터링 옵션이 있기를 원하기 때문에 (Masnory 플러그인에서는 사용할 수 없음). 당신은 전화 "를", 함수가 사용되어서는 안 Math.max의 조정을 알 수 있습니다

$.Isotope.prototype._masonryReset = function() { 
    // layout-specific props 
    this.masonry = {}; 
    this._getSegments(); 
    var i = this.masonry.cols; 
    this.masonry.colYs = []; 
    while (i--) { 
     this.masonry.colYs.push(0); 
    } 

    if (this.options.masonry.cornerStampSelector) { 
     var $cornerStamp = this.element.find(this.options.masonry.cornerStampSelector), 
      stampWidth = $cornerStamp.outerWidth(true) - (this.element.width() % this.masonry.columnWidth), 
     cornerCols = Math.ceil(stampWidth/this.masonry.columnWidth), 
     cornerStampHeight = $cornerStamp.outerHeight(true); 

     for (i = (this.masonry.cols - cornerCols); i < this.masonry.cols; i++) { 
      this.masonry.colYs[i] = cornerStampHeight; 
     } 
    } 
}; 

:

Answer 1

문제는 아래의 하나를 사용 ... Isotope.prototype 스크립트에 (필요 없음).