jQuery를 모바일 팝업

매우 인기있는 팝업 대화 팝업 페이지 화면에 오버레이 할 수있다.

팝업은 텍스트, 사진,지도 또는 다른 콘텐츠를 표시하기 위해 사용될 수있다.

팝업 및 <A> <div> 요소를 사용할 필요가 만듭니다. <A> 요소에 데이터 확인해 = "팝업"속성을 추가, <div> 요소는 데이터 역할 = "팝업"속성을 추가 할 수 있습니다. 그 다음 우리는 <div>에 대한 ID를 지정하고 HREF 값 <A> <DIV> 지정된 ID를 설정합니다. <DIV> 내용은 콘텐츠 팝 디스플레이입니다.

<DIV> 팝과 같은 페이지에 있어야합니다 링크를 <A> 클릭을합니다.

예

href가 = "# myPopup" data-rel = "popup" 클래스 = "ui-btn ui-btn-inline ui-corner-all"> 디스플레이 팝업 </a>에

<사업부의 데이터 역할 = "팝업 "ID = "MyPopup을">
<P>이 단순한 팝입니다 </ P>
</ DIV>

»시도

당신이 "UI 콘텐츠 '카테고리를 추가 할 수 있습니다 외부에 패딩을 추가하고 팝업에서해야하는 경우 <DIV>에서 :

예

»시도

닫기 팝업

기본적으로 팝업 외부 영역을 클릭하거나 팝업을 닫습니다 "ESC"키를 누릅니다. 당신이 추가 된 데이터-취소 가능한 = "false"를 속성을 추가 할 수있는 팝업 닫기 팝업 이외의 영역을 탭하지 않으려면 (권장하지 않음). 또한 속성에 데이터 확인해 = "뒤로"버튼을 사용하여, 팝업에 닫기 버튼을 추가 할 수 있으며 스타일을 통해 버튼의 위치를 제어 할 수 있습니다.

기술	예
오른쪽에있는 닫기 버튼	시험
왼쪽에있는 닫기 버튼	시험
데이터 취소 가능한 속성을 사용하여	시험

위치 팝업

기본적으로 팝업은 팝업의 위치를 제어해야하는 경우, 해당 링크에 팝업 클릭을 열기위한 속성 데이터 위치를-사용할 수 있습니다 직접 요소에 클릭 위에 표시됩니다.

세 가지 방법으로 팝업 위치를 제어 :

속성 값	기술
데이터 위치에 = "창"	창 중앙에 표시 팝업
데이터 위치에 = "#에 대한 myid"	알려진 요소에 표시되는 팝업 #ID
데이터 위치에 = "기원"	기본. 팝업 디스플레이 요소를 클릭합니다.

예

<a href="#myPopup1" data-rel="popup" class="ui-btn" data-position-to="window"> 창 </a>에
<a href="#myPopup2" data-rel="popup" class="ui-btn" data-position-to="#demo"> 한 id = " 데모"</a>를
<a href="#myPopup3" data-rel="popup" class="ui-btn" data-position-to="origin"> 원산지 </a>에

»시도

전이

기본적으로 팝업은 전환 효과입니다. 당신이 전환 효과를 추가 할 수 있습니다 원하는 경우 (데이터 전환을 통해 = "값"속성 jQuery를 모바일 전환 ) :

전환 효과의 모든 인스턴스

<a href="#myPopup" data-rel="popup" class="ui-btn" data-transition="fade"> 페이드 </a>를

»시도

팝 방향 작은 국경

당신이 국경의 작은 팝업 방향을 추가해야하는 경우 (왼쪽) 데이터 화살표 속성을 사용하고 값이 "L"을 지정 할 수있다 "t"(상), (오른쪽) "R"또는 "b"(아래) :

예

<a href="#myPopup" data-rel="popup" class="ui-btn"> 오픈 팝 </a>를

<DIV 데이터 역할 = "팝업 "ID = "MyPopup을"클래스 = "UI 콘텐츠"데이터 화살표 = "L">
<P> 국경 방향을 떠났습니다. </ P>
</ DIV>

»시도