테스트 사이트 - 개발 중인 베타 버전입니다

반응형 최신글 갤러리

· 11년 전 · 22334 · 11
2014-03-02 17_32_48-Welcome _ test6.work.org - Chrome.png
2014-03-02 17_33_21-Welcome _ test6.work.org - Chrome.png
명칭 : x-gallery

소스 : https://github.com/withcenter/x/tree/master/skin/latest/x-rwd-gallery

연락 : http://gnuboardx.com thruthesky@gmail.com

설명 : 일반적인 최근 글 스킨의 사용방법과 동일하다.
반응형으로 제작되었으므로 장치(모바일, PC 등)에 상관없이 사용 할 수 있다.
화면의 크기에 따라 사진의 크기가 작아졌다 줄어들었다 하며, 특정 너비에서 사진의 갯수가 줄어들며 내용이 사라진다. 화면이 커지면 사진의 갯수가 늘어나며 제목과 함께 내용이 나타난다.
스킨을 다운로드하여 G5_PATH/skin/latest 와 G5_PATH/mobile/skin/latest 에 각 각 복사를 해 넣으면 된다. 그러면 별도의 수정없이 모바일과 PC 에서 사용가능하다.
반응형에 대해서 잘 이해하고 사용해야한다.
특히 부모(또는 조상) box(block 형 엘리먼트)에 고정폭을 준다면 반응형이 될 수 없으며 그에 따라 반응형으로 동작하지 않을 것이다.

참고: 사진이 없는 글이 있을 수 있으므로 최근글의 갯수를 여유있게 40 으로 지정했다. 이미지의 갯수를 늘이거나 줄이고자 한다면, 소스 자체를 수정해야하며, 겉 모양만 변경하고자 한다면 소스는 수정하지 말고, CSS 오버라이딩으로 하기를 권한다.



예제 1 ) 간단한 사용 방법
------------------------------------------------------------
<?=latest( 'x-gallery', 'ms_test6_1');?>
------------------------------------------------------------


예제 2 ) 일반적인 사용 방법
------------------------------------------------------------
<?php
echo latest( 'x-gallery-test', 'ms_test6_1', 40, 40, 1,
array(
'width' =>300,
'height' =>180,
'radius' => 0
)
);
?>
------------------------------------------------------------




예제 3 ) CSS Overriding. 코드 아래에 CSS 클래스를 상속 또는 덮어쓴다.
-------------------------------------------------------------
<?php
echo latest( 'x-gallery-test', 'ms_test6_1', 40, 40, 1,
array(
'width' =>300,
'height' =>180,
'radius' => 0
)
);
?>
<style>
.x-gallery .text {
background-color: white!important;
}
.x-gallery .text a {
color: black!important;
}
</style>
------------------------------------------------------------

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 11개

2년 전
감사합니다 ^^

게시글 목록

번호 제목
46735
46696
46658
46645
46595
46519
46467
46439
46437
46431
46423
46397