2011-12-21 4 views
1

레이아웃 용으로 벽돌을 사용하고 있습니다. 브라우저의 윈도우 크기가 변경되면 Masonry가 레이아웃을 재실행하기 전에 몇 가지 계산을 수행하고 싶습니다.벽돌 편집 전에 코드를 실행하는 방법

지금까지 jquery.masonry.js 파일을 수정하고 옵션에 콜백 함수를 추가하여이 작업을 수행 할 수있었습니다. 하지만 석조 코드를 수정하지 않고 그것을하고 싶습니다.

$container.masonry({ 
    itemSelector : '.grid-element' 
    , preResizeCallback : doPreResize 
    , isResizable : true 
}); 

다음 doPreResize에서 내가해야 할 무엇이든 할 : 추가

옵션은 (벽돌 초기화) 다음과 같다. 의 .js 파일의 수정에있는 resize 기능 (버전 v2.0.110927에 가까운 라인 293) : 내가하고 싶은 무엇

resize : function() { 
    //added callback to be called before doing resizing-related code 
    if (this.options.preResizeCallback) 
    { 
     this.options.preResizeCallback(this.element); 
    } 
    //rest of code 

다음 false과로 설정 isResizable 옵션을 벽돌을 초기화하는 것입니다 스마트 리사이즈 이벤트를 유지하면서 세미 수동으로 크기 조정을 트리거합니다.

'스마트 리사이즈'이벤트를 설정하여 resizeLayout과 같은 함수를 호출 할 수 있습니까? 내가 부족 무엇

function resizeLayout(event) { 
    //do precalculations 

    //tell masonry to reorganize layout 
    $container.masonry(); 
} 

isResizabletrue 설정하는 방법은 지속적으로 트리거되지 않으며, 대신 벽돌과 같은 방법을 수행 할 수 있도록 크기 조정 이벤트를하는 것입니다 않을 때입니다.

답변

1

이 같은 이벤트를 설정할 수 있습니다

jQuery(window).bind('smartresize.masonry', function(){ 
    $container.masonry(); 
}); 

을하지만 그건 벽돌은 재 배열 벽돌의 최적화를 잃는 경우 컨테이너의 변화에 ​​맞게 열 수. 대신 내가

jQuery(window).bind('smartresize.masonry', function(){ 
    $container.masonry("resize"); 
}); 

를 사용하는 경우 나는 documented 아닌 내부 기능을 사용하여 끝낸다.

0

벽돌은 bind/resize 이벤트에 바인드 해제 할 수있는 옵션이 있습니다.

동일한 문제가 있었지만 resize 이벤트에 '언 바운드'석조를 초기화 한 다음 같은 방식으로 벽돌을 호출하는 크기 조정 함수를 작성했지만 처음 실행 된 코드 이후에 수정했습니다.

$container.masonry({ 
    isResizeBound: false 
}); 

$(window).bind('resize', function() { 
    someFunction(); 
    $continer.masonry({ 
     isResizeBound: false 
    }); 
}); 
+0

나는이 방법은 (1)뿐만 아니라 블록을 재 배열 않는다는 것입니다 일을 함께 문제를 생각하지만, 그것은 모든 시간을 할 것 (2) 설정 함수를 호출하여 처음부터 온통 벽돌을 설정 resize event triggers는 내가 피하고 싶었던 것입니다. ('smartresize.masonry'는 브라우저의 크기를 변경하지 않고 몇 밀리 초가 지나면 트리거됩니다). – frozenkoi

관련 문제