라이믹스/XE의 다양한 모듈, 스킨, 애드온 등의 자료를 판매해보세요.

콘텐츠 수 106

롤링 배너 위젯

등록일

2023-03-31

- 롤링 배너 위젯 -

 

XE 타운 우측 하단에 보면 배너들이 움직이는 위젯 보이시죠?

그것과 비슷하게 만든 롤링배너 위젯입니다. XE타운에서 사용중인 롤링 배너 위젯은 CONORY님이 공개를 하지 않는다고 하신만큼 비슷하게 구현해 봤습니다. 

 

 

 


<배너 이미지는 XE타운에 있는 배너 이미지를 무단으로 사용했습니다. 문제될 시 말씀해주세요. 삭제하겠습니다.>

 

여러 배너들을 효율적으로 보여주는데 도움이 됩니다.

제 비루한 실력으로 인해 오류들이 발생할 수 있습니다. 그리고 그 오류를 해결하는데에 상당히 긴 시간이 걸릴수도 있음을 먼저 알려드립니다.

 

 

- 특징

여러 배너 이미지를 효율적인 공간에 보여지도록 할 수 있습니다.

해당 배너를 클릭하면 지정한 사이트로 이동할 수 있습니다.

배너에 대한 제목과 설명을 추가할 수 있습니다.

보여질 배너의 수, 속도 등 상세하게 설정할 수 있습니다.

 

 

- 설정방법

 

먼저, 해당 배너들과 연결될 게시판을 하나 신설합니다.

 

 

1. 썸네일 생성 방법

크롭(crop)과 비율유지(ratio) 중에서 선택가능합니다.

 

2. 순서 섞기 :

"예"를 선택한 경우 위젯이 불러온 전체 배너 수에서 랜덤하게 표시를 합니다.

"아니오"를 선택한 경우 최근 글 부터 차례대로 보여집니다.

 

3. 마우스 오버시 스크롤 멈춤 / 이전, 다음버튼 보이기

배너의 이전, 다음 버튼을 보이게 하면 마우스를 오버해도 스크롤이 됩니다.

마우스 오버시에 스크롤이 멈추게 하면 배너의 이전, 다음 버튼이 보이지 않습니다.

 

4. 이미지 너비 / 높이

생성할 배너 이미지의 너비와 높이를 구합니다.

 

5. 한번에 보여질 배너 수

한 페이지에 보여질 배너 수를 결정합니다.

 

6. 총 배너 수

불러올 총 배너의 수를 결정합니다. 설정된 값보다 게시판에서 불러올 배너 이미지의 수가 적은 경우에는 설정된 값 만큼 다시 반복합니다.

 

예) 설정값 10 / 실제 게시글 수 7

배너가 7개는 정상적으로 보여지고 나머지 3개는 7개중 반복되어서 보여집니다.

 

7. 자동 스크롤 속도

가만히 놔두면 저절로 배너가 스크롤 되는데 몇 초후에 스크롤 될지 결정합니다. (단위 : 밀리초)

 

8. 스크롤 속도

다음 배너가 스크롤 될 때, 얼마나 빨리 스크롤 되는지 결정합니다.

 

9. 배너 상하 여백

배너의 간격을 결정합니다. 위, 아래에 동시에 적용되므로 실제 적용시 간격이 설정값에 두배가 된다고 생각해야 합니다.

 

10. 마우스 휠로 스크롤

위젯 위에 마우스를 오버한 후 마우스 휠을 돌리면 다음 배너가 보여집니다. 단, 휠을 어느방향으로 돌려도 다음 배너만 보여집니다.

 

11. 링크사용

배너를 클릭시 이동하도록 할지 결정합니다.

 

12. 링크 주소가 있는 사용자 정의 이름

게시판에서 사용자 정의로 등록할 때, 링크 주소가 쓰여질 사용자 정의 이름(첫글자 영문)을 입력하면 됩니다. 기본값은 url 입니다. 형식은 한줄 입력칸형태로 괜찮으나, http:// 나 https:// 가 들어가야 하므로 URL형식을 추천합니다.

 

13. 배너 제목 사용자 정의 이름

img 태그에 title로 사용될 이름이 들어갈 사용자 정의 이름 입니다. 기본값은 title 입니다. 형식은 한줄 입력칸 형태로 해주세요.

 

14. 배너 설명 사용자 정의 이름

img 태그에 img 태그에 title로 사용될 설명이 들어갈 사용자 정의 이름 입니다. 기본값은 desc 입니다. 형식은 한줄 입력칸 형태로 해주세요.

 

13, 14번 예제 

15. 배너 태두리 두께

숫자만 입력하세요. 단위는 px 입니다.

 

 

간편 사용방법

1. 새 게시판 하나 신설합니다.

2. 사용자 정의에서 3가지를 추가하고, 사용자 정의 이름을 다음과 같이 합니다.

url (링크 주소 사용)

title (img 태그에서 title 표시)

desc (img 태그 title에 들어갈 보조 내용)

3. 게시판에 글을 등록합니다.

    단, 배너는 각 게시글에 직접 그림 파일을 업로드 해야 정상적으로 작동합니다.

 

 

 

- 미리보기

사용 전 테스트용 미리보기 입니다. 

http://test.studyforus.com/index.php?mid=page_wIQO39

 

게시판에 별도로 이미지를 올려서 테스트 해보세요. (비회원 업로드 가능)

그리고, 미리보기 사이트는 예고없이 작동이 안될 수도 있습니다.

 

 

- 버전

V 0.1 - 초기 버전

 

네이버에 이온디를 검색해주세요
미리보기
파일 다운로드하기 전 사용하실 도메인 주소를 입력 후 다운로드 가능합니다.
파일 이름 잔여일 상태 다운로드
rolling_banner_v0.1.zip - - 다운로드
분류 위젯
판매자 XE마켓
사용자평점 0점 / 총 0명 참여
판매포인트 100P
상품카테고리 위젯 
상태 제품소개 
소개 XE 타운 우측 하단에 보면 배너들이 움직이는 위젯 보이시죠? 그것과 비슷하게 만든 롤링배너 위젯입니다. XE타운에서 사용중인 롤링 배너 위젯은 CONORY님이 공개를 하지 않는다고 하신만큼 비슷하게 구현해 봤습니다. 
설치경로 /widgets/rolling_banner 
버전 0.1 
라이센스 XPM 
지원환경  
개발자 사과맛스타 
구매 페이지 https://xetown.com/point_contents/539257?page=2 
미리보기  
구성품  
문의  
라벨  
외부URL  
네이버에 이온디를 검색해주세요

분류

고급

  • 상품카테고리

  • 상태

  • 지원환경

List of Articles
번호 분류 제목 사용자평점 포인트
상품 커스터마이징 건에 대해서
이온디샵에서 개발자/디자이너 여러분의 컨텐츠를 판매하세요.
포인트샵 오픈마켓입니다. 구매를 원할 경우 포인트를 충전해주세요.
20 위젯 메뉴 목록 및 검색 위젯 무료
19 위젯 Slack Chat 위젯 무료
18 위젯 레벨별 포인트/경험치(회원그룹포함) 표시 위젯 무료
17 위젯 프로필 위젯 무료
16 스킨 윤삼님의 프로필 위젯의 스킨 무료
15 위젯 사용자 배너 위젯 V0.1 50P
» 위젯 롤링 배너 위젯 100P
13 위젯 포인트+경험치 현황 위젯(그래프 타입) 무료
12 위젯 일일 접속자 카운터 위젯 무료
11 레이아웃 Equeer 레이아웃 1.4.5 (반응형 지원) 무료
10 위젯 SOLAPI 문자메시지 / 카카오톡 보내기 위젯 무료
9 위젯 회원 간편 검색 위젯 무료
8 스킨 회원 간편 검색 위젯 심플 스킨 무료
7 위젯 세션 기반 추천 게시글 출력 위젯 무료
6 위젯 proto 컨텐츠 위젯 무료
5 위젯 네모 경험치 랭킹 위젯 V0.2 50P
4 위젯 미니톡 실시간 채팅 위젯 무료
3 위젯 MH 트렌스포머 PopUp위젯 50P
2 위젯 동영상 컨텐츠 위젯 for 동영상 변환 모듈 무료
1 위젯 길드 랭킹 표시 위젯 1,870P