영삼이의 IT정보2011. 12. 30. 11:26
http://flytgr.thoth.kr/?mid=blog&document_srl=1279813


자 이 주소로 가보자 -_-; 
Posted by 다오나무
영삼이의 IT정보2011. 11. 17. 19:24

- 윈도우즈를 위한 미디어 플레이어

- 간단한 플레이어

http://mpui.sourceforge.net/index.php?page=about

About MPlayer and MPUI

MPlayer is arguably the best media player application of the world. Is is almost strictly monolithic, which means that it mainly consists of a single 7 MB executable that already contains all necessary codecs – for most files, it does not need any external codecs to be installed. If you want to know more about this wonderful program, please visit the MPlayer homepage.

The roots of MPlayer are in the Unix environment, and it shows in the way MPlayer is used: There is no graphical user interface, or at least none worth mentioning. Instead, MPlayer completely relies on a well-crafted command line interface and powerful keyboard shortcuts. While this is perfectly OK for Unix enthusiasts, Mac and Windows users prefer nice and more or less colorful graphical interfaces. There is already a »semi-official« OS X port, but up to now, no such project exists for the Windows platform.

This is where MPUI comes into play. It is a small program for Windows that takes the command-line hassle off you. Instead, you will get a no-frills, straight-to-the-point GUI that resembles the venerable Windows Media Player 6. It does not support every feature of MPlayer – there are just too many of them – but it is a solid »workhorse« media player tool suitable for most, if not all, everyday needs.

Features

MPlayer and MPUI, when teamed up, offer the following features:

  • A media player with a clean and simple interface.
  • Plays hundreds of different video and audio formats, including MPEG-1, -2 and -4 (DivX), H.264, MP3, Ogg Vorbis and AAC. For most media files, no additional codecs are needed. (This is because MPlayer is not one of the uncounted DirectShow players – the codecs are directly integrated into MPlayer.exe.)
  • MPUI and MPlayer together are just about 3.5 MB in size.
  • The most important MPlayer options (aspect ratio, deinterlacing, and postprocessing) can be configured without typing in cryptic command-line options. (But if you want or need some non-standard options, you can still add them by hand.)
  • Support for multiple audio and subtitle tracks on DVDs.
  • Combines MPlayer's cool keyboard navigation with a mouse-controlled seekbar.
  • Plays files, network streams and discs (such as (S)VCD or DVD). Drag&Drop supported.
  • Multilingual user interface.
  • No installation is required to use MPUI/MPlayer. Simply copy the two .exe files into a directory of your choice an run MPUI.
  • Using a special autorun.inf file, self-playing DivX CDs can be made. This adds only 3.5 MB to your CD, and on the computer playing the disc, no codecs need to be installed.
  • Both programs are free, licensed under the GNU General Public License.
Posted by 다오나무
영삼이의 IT정보2011. 11. 17. 02:01

몇 십년간 보드게임으로 인기를 누려 왔던 스토리를 아이폰에 적용한 게임입니다. '부자아빠 가난한아빠'를 저술한 작가도 이 게임을 아주 극찬 했습니다. 현재 아이튠즈 게임 카테고리 상위권에 있습니다.

무료

카테고리: 게임

등록일: 2011.11.11

버전: 1.0.8

크기: 60.3 MB

언어: 한국어, 영어, 일본어

개발자: M&M GAMES Corp

© M&M Games

4+ 등급

요구사항: iPhone 3GS, iPhone 4, iPhone 4S, iPod touch (3세대), iPod touch (4세대) 및 iPad와(과) 호환됩니다. iOS 4.2 버전 이상이 필요합니다.
아이튠즈 링크 :  http://itunes.apple.com/kr/app/id477076603?mt=8 바로가기

Posted by 다오나무
영삼이의 IT정보2011. 11. 11. 19:01

스크립트를 이용하는방법
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
// [/iPhone/i]  OS가 iPhone
// [/iPod/i]  OS가 iPod
// [/Symbian/i]  OS가 심비안
// [/Windows CE/i] OS가 윈도우모바일
// [/BlackBerry/i] OS가 블랙베리 
// [/Android/i]  OS가 안드로이드일 경우
if( (navigator.userAgent.match(/iPhone/i)) ||
(navigator.userAgent.match(/iPod/i)) ||
(navigator.userAgent.match(/Symbian/i)) ||
(navigator.userAgent.match(/Windows CE/i)) ||
(navigator.userAgent.match(/BlackBerry/i)) ||
(navigator.userAgent.match(/Android/i)))
{
window.location.href='./photo.php'; // 저중 하나라도 조건이 만족하면 /m/index.php 로 이동한다.

//-->
</SCRIPT>

php를 이용하는방법
<?
$T = $_SERVER['HTTP_USER_AGENT'];
if(strrpos($T,"Android") || strrpos($T,"iPhone"))
{
if(strrpos($T,"SHW-M180S")) // 갤럭시 탭
{
  $goMobile = "No";
}
else
{
  $goMobile = "Yes";
}
}

if($goMobile == "Yes")
{
?>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
  window.location.href='m1.php';
//-->
</SCRIPT>
<?
}
?>
먼저 $T로 브라우져의 정보를 알아낸다음...
그것으로 처리 하면 된다.

Posted by 다오나무
영삼이의 IT정보2011. 11. 9. 02:00

원본: http://iphonedevelopertips.com/user-interface/uialertview-without-buttons-please-wait-dialog.html
출처: http://www.devpia.com/MAEUL/Contents/Detail.aspx?BoardID=7462&MAEULNO=911&no=52368&page=1

If you’ve ever wanted to show a simple “please wait” dialog without resorting to a custom view, UIAlertView is a good option, and is even more appropriate if you customize the alert such that no buttons are shown.

In the figure below you can see how a simple alert can be shown (sans buttons) while you are busy doing some other system activity (reading/writing files, etc).

UIAlertView without Buttons
UIAlertView *alert;   ...   alert = [[[UIAlertView alloc] initWithTitle:@"Configuring Preferences\nPlease Wait..." 
  message:nil delegate:self cancelButtonTitle:nil otherButtonTitles: nil] autorelease];   [alert show];

Trouble with this approach is that things look a little lopsided, as there is a significant amount of dead space on the bottom where the button(s) are to be shown. We can fix this by adding a few newline characters at the start of our message:

UIAlertView *alert;   ...   // Add two newlines characters at the start of the message
alert = [[[UIAlertView alloc] initWithTitle:@"\n\nConfiguring Preferences\nPlease Wait..." 
  message:nil delegate:self cancelButtonTitle:nil otherButtonTitles: nil] autorelease];   [alert show];

The text is nearly centered, yet we’ve created a different problem, there is now white space on the top and bottom. There is one more approach…

UIAlertView with UIActivity Indicator

In the whitespace on the bottom, let’s add an activity indicator. Also, remove the newlines in the message text so the text starts near the top:

UIAlertView *alert;   ...   alert = [[[UIAlertView alloc] initWithTitle:@"\n\nConfiguring Preferences\nPlease Wait..." 
  message:nil delegate:self cancelButtonTitle:nil otherButtonTitles: nil] autorelease];

[alert show];   UIActivityIndicatorView *indicator = [[UIActivityIndicatorView alloc] 
  initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];

// Adjust the indicator so it is up a few pixels from the bottom of the alert
indicator.center = CGPointMake(alert.bounds.size.width / 2, alert.bounds.size.height - 50);
[indicator startAnimating];
[alert addSubview:indicator];
[indicator release];

Dismissing the Buttonless UIAlertView

Since there are no buttons associated with the alert, we have to dismiss the alert ourselves, versus the traditional approach where the system dismisses the alert when a button is pressed.

Here is the call to dismiss the alert:

[alert dismissWithClickedButtonIndex:0 animated:YES];
Posted by 다오나무
영삼이의 IT정보2011. 11. 9. 01:31

UIAlertView *alert = [[[UIAlertView alloc] initWithTitle:@"잠시만 기다려주세요.\n로딩중..."

                               message:nil delegate:self cancelButtonTitle:nil otherButtonTitles: nil] autorelease];

[alert show];

UIActivityIndicatorView *indicator = [[UIActivityIndicatorView alloc]

                                     initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];

indicator.center = CGPointMake(alert.bounds.size.width / 2, alert.bounds.size.height - 50);

[indicator startAnimating];

[alert addSubview:indicator];

[indicator release];

로딩중.png

Posted by 다오나무
영삼이의 IT정보2011. 11. 4. 03:58

<자바스크립트 명령어>

자바스크립트는 자료형을 쓰지않고 변수선언이 가능함
ex)
i=10
s=한글

<script language=javascript> </script> //이사이에 자바스크립트 명령어들사용

function 메서드명{} //사용자정의 메서드를 만든다

document.write() //화면에 메세지를 출력한다 (system.out.print기능)

document.write("<br>") //한줄 내린다

document.write("&nbsp") // 일정칸띄운다

prompt("메세지","기본값") // 입력창을 띄운다

alert()  // 알림창을 띄운다

confirm() //확인 취소창 (확인은 true,취소는 false반환)

<input type=button value=함수호출 onclick=aa()> // 버튼을 클릭하면 aa()함수를 호출한다

i=parseInt(변수)//문자열을 정수로 정수로변환

OnClick  // 마우스 클릭했을때

OnMouseOver //마우스가 올라왔을때

OnMouseOut // 마우스가 나갔을때

OnLoad  //페이지 시작시 실행한다 body에만 사용가능
ex)<body OnLoad=메서드명>

OnUnload // 페이지에서 나갔을때 body에만 사용가능
ex)
<body OnUnload=메서드명>

OnChange //값을 변경했을때

OnBlur  // 커서제거시 실행 (focus를 잃었을때)

OnFocus // 커서가 있을시 focus가 들어가면실행

document.myform.pwd.value=""; //myform의 pwd에 내용삭제

document.myform.pwd.focus(); //myform의 pwd에 포커스를 맞춘다

*******************************************************************
<form name=myform>
<select name=job>
  <option selected>직업선택
   <option value=학생>학생
   <option value=회사원>회사원
   <option value=자영업>자영업
   <option value=백수>백수
   <option value=프로그래머>프로그래머
   <option value=주부>주부
   <option value=기타>기타
</select>

document.myform.job.options[i].text //i번째 text를 반환

document.myform.job.options[i].text.value //i값을얻는다

document.myform.job.options[i].text.selected //i선택돼었는가

document.myform.job.options.selectedIndex //선택한 위치를 얻는다

document.myform.job.options.length  //option배열 길이갯수반환

********************************************************************

스크립트의 배열
Sum=new Array(100,”kim”,188,9) 형에상관없이 하나의배열에 정수 실수 문자 모두가능

window.open("열릴주소이름or파일이름","새창이름","속성"); //새창을연다
속성의종류
menubar=yes  //메뉴바
scrollbars=yes  //스크롤바
resizable=yes  //창크기재설정
toolbar=yes  //툴바
status=yes //상태바
width=600  //폭
height=600 //높이

window.close();//창닫기

<a href=javascript:window.close()>닫기</a> //창닫기

<a href=javascript:self.close()>닫기</a> //창닫기

today=new Date(); //시스템날짜구하기
getYear()  //년도
getMonth() //월(0~11월이므로 표기시 +1)
getDate() //일
getDay()  //요일(일요일0 월1 토6)
getHours()  //시간
getMinutes() //분
getSeconds()  //초

window.status= //윈도우상태창설정

setTime(명령어,밀리초); //1초후에 명령어실행

setInterval(명령어,밀리초); //1초마다 명령어실행

location.replace(url);  // 지정 url로 대체(back)안됨

location.herf="url"  // back 가능

location.reload() // 새로고침

---------------------------------------

추가

var str = "test,123,test333".split(","); // ,단위로 나누어 배열저장

var str = "niee@naver.com".indexOf("@") //@의 문자열위치반환

var str = "niee@naver.com".substr(start,end); //start~end위치의 문자열반환첫문자의 위치는0번

var num = "123123123".replace("1","ee"); //1이라는 숫자가나오면 ee로변환 첫번째탐색되는1만해당

var num = "123123123".replace(new RegExp("1","g"),"ee"); //모든1을 ee로변환

[출처] 자바스크립트 명령어들|작성자 niee

Posted by 다오나무
영삼이의 IT정보2011. 11. 2. 08:02

오늘 소개해 드릴 아이디어는 아이폰을 DSLR카메라처럼 만들자는 아이디어 입니다.

단지 렌즈만 붙이는것이 아니라 셔터같은 부가적인 기능도 있는데요.
전용 앱(APP)을 실행 시키면 진짜 카메라로 찍는듯한 느낌이 듭니다.

Concept Camera: The WVIL from Artefact on Vimeo.
그리고 사진보정및 사진공유같은 기능도 있네요~
실용화가 된다면 카메라를 따로 살 필요 없이 간편하게 화려한 사진을 찍을수 있을것 같습니다.
아이폰을 생각하다보면 핸드폰도 핸드폰이지만
이런 아이디어 넘치는 악세사리가 많아서 많이들 구입하시는것 같아요.

'영삼이의 IT정보' 카테고리의 다른 글

로딩중&hellip; 메세지박스 출력  (0) 2011.11.09
자바스크립트 명령어  (0) 2011.11.04
jQuery Mobile 일본글  (0) 2011.10.31
jQueryMobile 일본 글 [출처]  (0) 2011.10.31
데이터베이스와 테이블생성  (0) 2011.10.28
Posted by 다오나무
영삼이의 IT정보2011. 10. 31. 05:10

http://d.hatena.ne.jp/pikotea/20101019/1287484040

 

Page

요소 특성 개요
div data - role page 페이지

설정 기본 비고
data - fullscreen true 전체 화면
false *
data - theme 임의 a 기본 테마는 a ~ c


Header

요소 특성 개요
div data - role header 헤더

Page 포함

설정 기본 비고
data - nobackbtn true Back 버튼 자동 표시
(되지 않는 것)
false *
data - position inline *  
fixed   화면 하단에 고정 표시
data - theme 임의 a 기본 테마는 a ~ c


Content

요소 특성 개요
div data - role content 페이지 내용

Page 포함

설정 기본 비고
data - theme 임의 a 기본 테마는 a ~ c


Footer

요소 특성 개요
div data - role footer 바닥글

Page 포함

설정 기본 비고
data - position inline *  
fixed   화면 하단에 고정 표시
data - id 임의   여러 Page에 동일한 Footer을 정의한다. 화면 전환시 화면이 사라지지 않는다.

동일한 data - id를 가진 Footer를 자식 요소없이 정의한다.

(필수 data - position : fixed)

※ 자식 요소는 동일한 data - id를 가진 HTML 마지막으로 정의한다.

(다른 좋은 방법이 있는지 알 수 없음)

class ui - bar   바닥글 요소의 자동 패딩
data - theme 임의 a 기본 테마는 a ~ c


Navigation Bar

요소 특성 비고
div data - role navbar 화면 전환시 화면이 사라지지 않는다. Footer 요소에 포함한다.
data - id의 차이점은 Footer 내용을 미묘하게 바꾸는 것이 가능 (필수 data - position : fixed)


Page Link

요소 특성 개요
a - -

효과와 함께 화면 전환한다.

링크된 Page 요소를 # id로 지정하거나 URL을 상대 경로 지정으로한다.

다음 중 하나를 지정하면 일반 링크된다.

rel : external

target : _blank

data - request - type : http

설정 기본 비고
data - transition slide * 화면 전환 효과
slideup  
slidedown  
pop  
fade  
flip  
data - request - type http   일반 링크


Dialog

요소 특성 개요
a data - rel dialog 링크를 대화로 표시한다.

Page 요소를 # id로 지정하거나 URL을 상대 경로 지정으로한다.

설정 기본 비고
data - transition slideup   대화 효과
pop *
flip  


Button

요소 특성 개요
input type button 버튼
submit
reset
image
a data - role button

설정 기본 비고
data - icon arrow - l   아이콘 종류
arrow - r  
arrow - u  
arrow - d  
delete  
plus  
minus  
check  
gear  
refresh  
forward  
back  
grid  
star  
alert  
info  
data - iconpos left * 아이콘 위치
right  
notext  
class ui - btn - left * 버튼 위치
ui - btn - right  
ui - btn - active   선택 상태
data - theme 임의 a 기본 테마는 a ~ c


Inline

요소 특성 개요
div data - inline true 여러 요소를 1 줄로 표시한다.
false


Control Group

요소 특성 개요
div data - role controlgroup 여러 요소를 그룹화한다.

Button, Radio, Checkbox 요소 등

설정 기본 비고
data - type vertical * 세로로 그룹화
horizontal   가로로 그룹핑


Grid

요소 특성 비고
div class ui - grid - a ui - grid - a는 가로 2 분할, ui - grid - b는 가로 3 분할.

자식으로 div 요소의 class : ui - block - a - ui - block - c에 대응한다.

ui - grid - b
fieldset class ui - grid - a
ui - grid - b
data - theme 임의 a 기본 테마는 a ~ c


Collapsible

요소 특성 비고
div data - role collapsible 개폐 가능한 블록. 제목이 필수 (h1 ~ h6 요소)

설정 기본 비고
data - state collapsed   초기 표시를 닫은 상태로
data - theme 임의 a 기본 테마는 a ~ c


Fieldcontain

요소 특성 비고
div data - role fieldcontain Form의 자식 요소를 묶으면 외형이 약간 변화하지만 상세 불명.
(화면 크기가 바뀌었을 때 위치 조정?)
fieldset


Form Elements

요소 특성 비고
input type text 텍스트 입력
password 암호 입력
search 검색창
range 범위 입력
radio 라디오 버튼

label 요소가 필요합니다. label의 for 속성 radio 요소의 id를 설정한다.

checkbox 확인란

label 요소가 필요합니다. label의 for 속성에 checkbox 요소의 id를 설정한다.

select - - 셀렉트 박스 입력

모든 option 요소가 Dialog 형식으로 표시되지 않는 경우 Page 형식으로 표시한다.

data - role slider 플립 토글 스위치

option 요소를 2 개를 필요가있다.

textarea - - 텍스트 영역 입력

설정 기본 비고
data - theme 임의 a 기본 테마는 a ~ c


List

요소 특성 비고
ul data - role listview 목록

(List / Read - only List)

ol data - role listview 번호 매기기 목록

(Numbered List)

설정 기본 비고
data - inset true   목록 화면 너비로 포장하지 않는다
false *
data - filter true   목록에서 검색을 검색 상자 표시
false *
data - theme 임의 a 기본 테마는 a ~ c


기타 ※ li 요소 등에 대한 지정. 여러 조합 가능

목록 형식 조건 비고
링크 매기기 목록

(Linked List)

자식 요소 a 요소를 포함 링크 표시
상자 목록

(Nested List)

자식 요소 ul 요소를 포함 목록을 중첩
구분 단추 목록

Split button List

자식 요소 a 요소 img 요소, h1 ~ h6 요소, p 요소 등 목록에 여러 요소를 표시하는
분할 목록 li 요소 data - role : list - divider를 지정한다. 목록 제목보기
카운트 버블 자식 요소 span 요소를 마신다. span 요소에 class : ui - li - count를 지정한다. 카운트보기
파일 자식 요소에 img 요소를 포함 파일보기
아이콘 자식 요소에 img 요소를 포함한다. img 요소에 class : ui - li - icon을 지정한다. 아이콘 더보기
레이블 자식 요소 h1 ~ h6 요소를 포함한다. 레이블을 표시하려면
비고 자식 요소 p 요소를 포함한다. 레이블 아래 비고보기
보충 자식 요소 p 요소를 포함한다. p 요소에 class : ui - li - aside를 지정한다. 오른쪽 상단에 보충보기

 

Posted by 다오나무
영삼이의 IT정보2011. 10. 31. 05:08

http://d.hatena.ne.jp/pikotea/20101019/1287484040

jQuery Mobile 참조적인 것을 만들었습니다.

급히 叩き台에서 태클 등이 있으면 댓글주세요!

Page

요소
특성

개요

div
data - role
page
페이지

설정

기본
비고

data - fullscreen
true
전체 화면

false
*

data - theme
임의
a
기본 테마는 a ~ c

Header

요소
특성

개요

div
data - role
header
헤더

Page 포함

설정

기본
비고

data - nobackbtn
true
Back 버튼 자동 표시
(되지 않는 것)

false
*

data - position
inline
*

fixed
화면 하단에 고정 표시

data - theme
임의
a
기본 테마는 a ~ c

Content

요소
특성

개요

div
data - role
content
페이지 내용

Page 포함

설정

기본
비고

data - theme
임의
a
기본 테마는 a ~ c

Footer

요소
특성

개요

div
data - role
footer
바닥글

Page 포함

설정

기본
비고

data - position
inline
*

fixed
화면 하단에 고정 표시

data - id
임의
여러 Page에 동일한 Footer을 정의한다. 화면 전환시 화면이 사라지지 않는다.

동일한 data - id를 가진 Footer를 자식 요소없이 정의한다.

(필수 data - position : fixed)

※ 자식 요소는 동일한 data - id를 가진 HTML 마지막으로 정의한다.

(다른 좋은 방법이 있는지 알 수 없음)

class
ui - bar
바닥글 요소의 자동 패딩

data - theme
임의
a
기본 테마는 a ~ c

Navigation Bar

요소
특성

비고

div
data - role
navbar
화면 전환시 화면이 사라지지 않는다. Footer 요소에 포함한다.
data - id의 차이점은 Footer 내용을 미묘하게 바꾸는 것이 가능 (필수 data - position : fixed)

Page Link

요소
특성

개요

a
-
-

효과와 함께 화면 전환한다.

링크된 Page 요소를 # id로 지정하거나 URL을 상대 경로 지정으로한다.

다음 중 하나를 지정하면 일반 링크된다.

rel : external

target : _blank

data - request - type : http

설정

기본
비고

data - transition
slide
*
화면 전환 효과

slideup

slidedown

pop

fade

flip

data - request - type
http
일반 링크

Dialog

요소
특성

개요

a
data - rel
dialog
링크를 대화로 표시한다.

Page 요소를 # id로 지정하거나 URL을 상대 경로 지정으로한다.

설정

기본
비고

data - transition
slideup
대화 효과

pop
*

flip

Button

요소
특성

개요

input
type
button
버튼

submit

reset

image

a
data - role
button

설정

기본
비고

data - icon
arrow - l
아이콘 종류

arrow - r

arrow - u

arrow - d

delete

plus

minus

check

gear

refresh

forward

back

grid

star

alert

info

data - iconpos
left
*
아이콘 위치

right

notext

class
ui - btn - left
*
버튼 위치

ui - btn - right

ui - btn - active
선택 상태

data - theme
임의
a
기본 테마는 a ~ c

Inline

요소
특성

개요

div
data - inline
true
여러 요소를 1 줄로 표시한다.

false

Control Group

요소
특성

개요

div
data - role
controlgroup
여러 요소를 그룹화한다.

Button, Radio, Checkbox 요소 등

설정

기본
비고

data - type
vertical
*
세로로 그룹화

horizontal
가로로 그룹핑

Grid

요소
특성

비고

div
class
ui - grid - a
ui - grid - a는 가로 2 분할, ui - grid - b는 가로 3 분할.

자식으로 div 요소의 class : ui - block - a - ui - block - c에 대응한다.

ui - grid - b

fieldset
class
ui - grid - a

ui - grid - b

data - theme
임의
a
기본 테마는 a ~ c

Collapsible

요소
특성

비고

div
data - role
collapsible
개폐 가능한 블록. 제목이 필수 (h1 ~ h6 요소)

설정

기본
비고

data - state
collapsed
초기 표시를 닫은 상태로

data - theme
임의
a
기본 테마는 a ~ c

Fieldcontain

요소
특성

비고

div
data - role
fieldcontain
Form의 자식 요소를 묶으면 외형이 약간 변화하지만 상세 불명.
(화면 크기가 바뀌었을 때 위치 조정?)

fieldset

Form Elements

요소
특성

비고

input
type
text
텍스트 입력

password
암호 입력

search
검색창

range
범위 입력

radio
라디오 버튼

label 요소가 필요합니다. label의 for 속성 radio 요소의 id를 설정한다.

checkbox
확인란

label 요소가 필요합니다. label의 for 속성에 checkbox 요소의 id를 설정한다.

select
-
-
셀렉트 박스 입력

모든 option 요소가 Dialog 형식으로 표시되지 않는 경우 Page 형식으로 표시한다.

data - role
slider
플립 토글 스위치

option 요소를 2 개를 필요가있다.

textarea
-
-
텍스트 영역 입력

설정

기본
비고

data - theme
임의
a
기본 테마는 a ~ c

List

요소
특성

비고

ul
data - role
listview
목록

(List / Read - only List)

ol
data - role
listview
번호 매기기 목록

(Numbered List)

설정

기본
비고

data - inset
true
목록 화면 너비로 포장하지 않는다

false
*

data - filter
true
목록에서 검색을 검색 상자 표시

false
*

data - theme
임의
a
기본 테마는 a ~ c

기타 ※ li 요소 등에 대한 지정. 여러 조합 가능

목록 형식
조건
비고

링크 매기기 목록

(Linked List)

자식 요소 a 요소를 포함
링크 표시

상자 목록

(Nested List)

자식 요소 ul 요소를 포함
목록을 중첩

구분 단추 목록

Split button List

자식 요소 a 요소 img 요소, h1 ~ h6 요소, p 요소 등
목록에 여러 요소를 표시하는

분할 목록
li 요소 data - role : list - divider를 지정한다.
목록 제목보기

카운트 버블
자식 요소 span 요소를 마신다. span 요소에 class : ui - li - count를 지정한다.
카운트보기

파일
자식 요소에 img 요소를 포함
파일보기

아이콘
자식 요소에 img 요소를 포함한다. img 요소에 class : ui - li - icon을 지정한다.
아이콘 더보기

레이블
자식 요소 h1 ~ h6 요소를 포함한다.
레이블을 표시하려면

비고
자식 요소 p 요소를 포함한다.
레이블 아래 비고보기

보충
자식 요소 p 요소를 포함한다. p 요소에 class : ui - li - aside를 지정한다.
오른쪽 상단에 보충보기

Posted by 다오나무