Masonry 라이브러리를 사용한 스킨
본문
http://internationale.kr/bbs/board.php?bo_table=photo_me
예전에 한번 써봤던 Masonry 라이브러리를 사용한 스킨을 다시 적용해보았습니다.
그때나 지금이나 실력이 나아지지않아 1~2군데 리스트가 아래위로 달라붙는 부분에 대한 해결법을 못찾겠습니다.
혹시 해결하신 분이 계실까요?
http://sir.co.kr/g5_skin?sca=&sfl=wr_subject%7C%7Cwr_content&stx=masonry
편리님의 스킨을 적용했구요. 다른 분들의 스킨들도 이 문제는 마찬가지입니다.
답변 2
스타일이 인라인으로 4번째 마다 margin 값이 !important 처리되어있습니다.
메이슨리 원래의 스타일값이 아니기 때문에..
php나 js 값 아니면 해당라인(class = gall_li masonry-brick 라인) 에 직접 스타일 속성으로 강제적으로 들어가게 하는것 같네요.
목록이기 때문에 문제있는 해당부분은 list.skin.php 에 있을걸로 추정되고요.(class = gall_li masonry-brick 있는 파일)
4번째 마다이기 때문에 js구문이든 php 문법이든 ..
" if (값%값 ==0) ~ " 또는 " if (값%값 ==1) ~ "이렇게 생긴 부분이 반드시 잇을겁니다.
해당부분을 잘 뒤져봐서 삭제해주세요
ps>
다운받아서 직접확인 했습니다.편리님의 스킨이 아니네요
list.skin.php 181~187
if($i>0 && ($i % $bo_gallery_cols == 0))
...
if ($k % $bo_gallery_cols == 0) $style .= "margin:0 !important;";
필요없는 구문이기 때문에 삭제해주세요.
뿐만아니라 변수 받는 그아래줄도 style="<?php echo $style ?>" 도 삭제해주세요.
메이슨리js에는 해당 스타일이 필요없습니다.
박스넓이를 23번째줄 columnWidth로 조정할려면
style=" width:<?php echo $board['bo_gallery_width'] ?>px" 이것도 삭제해주시고 그렇지 아니할경우는 놔두세요
아니면 columnWidth:<?php echo $board['bo_gallery_width'] ?> 이렇게ㅐ해도 되겟네요
편리님의 스킨인 것으로 기억하는데... 최신 그누보드 스킨과 다른 부분이 많아 고친 곳이 많습니다.
<?php
shuffle($list);
for ($i=0; $i<count($list); $i++) {
if($i>0 && ($i % $bo_gallery_cols == 0))
$style = 'clear:both;';
else
$style = '';
if ($i == 0) $k = 0;
$k += 1;
if ($k % $bo_gallery_cols == 0) $style .= "margin:0 !important;";
?>랜덤 출력 부분에 말씀하신 것과 같은 소스가 들어있네요.
편리님 원본에는 없는 부분인데...
아마도 어떤 필요에 의해 추가했던 부분이 아닐까 싶네요.
아뭏튼 갈끔히 해결했습니다. 고맙습니다!
Masonry 초기화 구문에 어떻게 적혀있나요?
기본적으로 Masonry 초기화시에 옵션값으로 gutter 이용해서 가로 여백설정하고, 세로는 margin-bottom 값만 있으면 되는걸로 알고 있습니다.
그누보드에는 적용해본적이 없어 특이사항이 있는지는 모르겠고요.
말씀하신 '초기화 구문' 부분이 어느 파일에 어떤 형태로 있는 것인지 모르겠네요.
항상 같은 위치의 리스트에서 그런 현상이 발생하는 것으로봐서... 어딘가 리스트 숫자나 규칙 같은 것이 있을 법한데... 못찾겠네요.
