묻고답하기
순위 데이터 ol-li 랭킹 아이콘..
2014.06.26 19:48
ol-li 태그로
1~10까지 png 아이콘을 가지고 적용시키고 싶습니다.
<ol>
<li>
<a></a>
</li>
</ol>
이러케 만들었습니다. 네이버 실시간 검색 순위처럼 랭킹을
1. ##
2. #^
3. @@
4. $$
5. &&
6.**
7. !!
8. %#
9. #$
10. %!
이런식으로 출력하고
저 숫자 자리에 제가 css 에 지정한 이미지를 출력하게 하고싶은데.. 도무지모르겟습니다.
<ol>
<li></li>
<li></li> ~~
...</ol>
이런식으로 li를 따로 만들어서 png 스타일로 붙여주는거 말궁요
이럴땐 자바스크립트를 써야하나요? 초보라서 질문드립니다..
댓글 11
-
열혈개발
2014.06.26 20:57
1. 그 자동으로 숫자가 붙는것에 숫자를 지우고 아이콘을 백그라운드로 넣을순있습니다
2. ul 말고 ol 이요
3. li을 여러개 만들고 넣는거 말구요 list view? 인가 그런 방식이요 제이쿼리인가 자바스크립트로 구현가능하다던데.
제말은 li 여러개만들어서 이미지 때려넣는거말구요
게임 랭킹이나 실시간 검색순위 처럼 되는거 말한겁니다.
-
열혈개발
2014.06.26 21:00
갤러리htm 가보니까
<li<!--@if($_idx>0 && $_idx % $widget_info->cols_list_count==0)--> class="clearLeft"<!--@end--> style="<!--@if($_idx >= $widget_info->list_count)-->display:none;<!--@end-->width:{$widget_info->thumbnail_width}px;">
이러케되잇던데 좀 알려주세요..
-
열혈개발
2014.06.26 21:08
{@$_idx++}
이걸로 카운트 올리는건 보이는데 다른건 아무리 생각해봐도 사용법을 ...
-
루프로 목록 뽑는 코드 한번 적어 보세요.
-
열혈개발
2014.06.26 21:21
할줄몰라서 질문하는건데 ;;
-
열혈개발
2014.06.26 21:22
제가 하는건 단순히 루프로 1~10 각각 다른 아이콘 넣기에요 ㅠ;;;; 클라스명을 1~10 으로 나오게만하면댈거같은데여
-
{@$_idx=1}<!--@foreach($widget_info->content_items as $key => $item)--><li class="num{$_idx}">{@$_idx++}</li><!--@end-->이게 일반적으로 위젯에서 li에 클라스명을 넣는 방법입니다.
-
HSJI
2014.06.26 23:00
음.. 예를 들면
<ul>
<li loop="$lang_supported=>$key,$val" cond="$key!= $lang_type"><b class="ico_flag _{$lang_type}"></b>
<a href="#" onclick="doChangeLangType('{$key}');return false">{$val}</a>
</li>
</ul>css파일에.
.ico_flag{background-image:url(../img/flags.png);background-repeat:no-repeat}
.ico_flag._ko{background-position:0 -1778px}
.ico_flag._en{background-position:0 -3360px}
.ico_flag._jp{background-position:0 -1680px}다국어 선택할때 이렇게 하는데요. 이렇게 하면 클래스 별로
각 국기 아이콘 + 언어로 죽 나옵니다.
DoorWeb님께서 말씀하신 방법이 가장 일반적인데.. 꼭 ol을 써야할 이유가 있나요?
-
열혈개발
2014.06.26 23:12
아뇨 ㅋㅋ 꼭 써야할이유는없지만 ..
-
HSJI
2014.06.26 23:46
<ul>
{@ $i=1}
<!--@while($i<=10) --><li>
<b class="abc_{$i}"></b>
<a>내용</a></li>
{@ $i++}
<!--@end --></ul>
foreach문이나 while문으로 루프돌리고.. (실시간 검색처럼 뜨려면 배열로 받아올테니 loop문이나 php의 foreach가 좋겠네요.)
css에서
.acd_1{background-image:url(xxx.png)}
.acd_2{background-image:url(yyy.png)}
이러면 되겠네요.
글쓴이 | 제목 | 최종 글 |
---|---|---|
XE | 공지 글 쓰기,삭제 운영방식 변경 공지 [16] | 2019.03.05 by 남기남 |
뉴클리어 | XE Offical V2 오타낫었나요 [1] | 2010.07.04 by HolyJohn |
salaciss | 콘텐츠 위젯 rss 이미지 [1] | 2010.07.04 by 백성찬 |
huksley | 메뉴에 링크연결 질문 [1] | 2010.07.04 by 아모스리 |
윌로우피페 | xe설치후 애드온에서 자동글 등록 방지 애드온 키고 백지가 되었습니다. 플리즈~ | |
수피아소년 | 확장변수를 웹진 형태에서 출력시 이미지로 띄우기 | |
tldy | 제로보드에서 성인들만 들어갈 수 있는 게시판 | |
어쭈구리メ | 익명이였던것을 닉네임으로 바꾸면.. [1] | 2010.07.04 by guny |
영원문화 |
xe 게시판에 글 쓸때
[2]
![]() | 2010.07.04 by 휘즈 |
Hodoll | FTP 계정 정보 입력 에러 [1] | 2010.07.04 by HolyJohn |
헤스페리데스 | 롤이미지 스크립트 삽입에 문제가 있어 구원 요청합니다. | |
하태진019 | 신디케이션은 동기화문서 > 네이버에 노출되는글... 이렇게 되는건가요? | |
성게 | BBCode 관련 질문 | |
인형의기사 |
상단 메뉴 이미지사이의 간격이 줄어들지 않습니다.
[1]
![]() | 2010.07.05 by ToFinder |
윌로우피페 | xe 설치후 리퍼러 및 자동글방지 애드온등 애드온을 켜면 전체사이트 백지화문제 | |
양점열 | zb41pl6 폴더에 갑자기 생긴 새로운 폴더 문제 [1] | 2010.07.05 by korea3d |
박규석383 | cafeXE 생성시 에러 메시지 | |
huksley | 위젯스타일을 지정하면 다 없어져요 [1] | 2010.07.05 by huksley |
장미향기 |
회원정보보기에서의 글씨색상 변경법
[1]
![]() | 2010.07.05 by mindpainter |
울보왕자 | 홈페이지에 접속시 중국어로 노출되게 하고 싶어요. [3] | 2010.07.05 by 곰돌이. |
ㅠㅠ; | xe설치시 Firebird DB를 선택할 수 없어요 ㅠㅠ [1] | 2010.07.05 by 안다미로 |
ol 경우는 순서있는 목록이라 자동으로 숫자가 붙습니다.
숫자 없는 형태를 원하시면 ul로 하셔야 하고요.
숫자를 이미지로 바꾸고 싶으시면 li마다 각 클라스명을 넣으시고 그 클라스명 마다 배경이미지를 넣으시면 됩니다.
li에 순서에 맞게 클라스명 넣는 방법은
content위젯 gallery.html에서
{@$_idx=0} 사용법을 확인하시면 순서대로 클라스명 넣는데 문제가 없을겁니다.