Jquery Tabs 플러그 인 프로필 - 페이지 를 더 우호 적 으로 구성 합 니 다.
7580 단어 jquery
Jquery Tab 플러그 인 에 대해 서 는 jQuery UI Tabs 가 유행 하고 있 습 니 다. 최근 에 도 이 플러그 인 이 업데이트 되 었 습 니 다. 주 소 는 http://stilbuero.de/jquery/tabs_3/ 입 니 다. ，현재 국내 많은 사이트 에서 도 이 플러그 인 을 사용 하고 있 으 니 시간 이 있 으 면 사용 해 보 세 요.
오늘 갑자기 더 가 벼 운 기능 이 풍부 한 Jquery Tab 플러그 인 을 발 견 했 습 니 다.먼저 그 기능 을 보 여주 기;
1. 간단하게 설정 하면 다음 과 같은 효 과 를 얻 을 수 있 습 니 다.
http://flowplayer.org/tools/demos/tabs/index.html
2. CSS 스타일 을 확장 하면 자신의 tabs 를 맞 출 수 있 습 니 다.
/* alternate colors: skin2 */
ul .skin2 a {
background-color: #89a ;
color: #fff !important;
}
/* mouseover state */
ul .skin2 a :hover {
background-color: #678 ;
}
/* active tab */
ul .skin2 a .current {
background-color: #4F5C6A ;
border-bottom: 2px solid #4F5C6A ;
}
/* tab pane with background gradient */
div .skin2 div {
color: #fff ;
background: #234 url( /img/global/gradient/h300.png) repeat-x scroll 0 -50px ;
min-height: 200px ;
} 효 과 는 다음 과 같 습 니 다:
http://flowplayer.org/tools/demos/tabs/skins.html
3. 브 라 우 저의 [전진] 과 [후퇴]
Code
$( function () { $( " ul.css-tabs " ).tabs( " div.css-panes > div " , {history: true }); });
효 과 는 다음 과 같 습 니 다:
http://flowplayer.org/tools/demos/tabs/history.html
4. Ajax 를 통 해 모든 Tab 의 내용 을 호출 합 니 다. Tab 단 추 를 처음 눌 렀 을 때 만 Tab 페이지 의 내용 을 호출 합 니 다.
사용 이 매우 간단 합 니 다. 효 과 는 다음 과 같 습 니 다.
http://flowplayer.org/tools/demos/tabs/ajax.html
5. Tab 가이드, 예 를 들 어 카 트 주문 과정 형성
개인 정보 보완 - > 카 트 상품 수정 - > 주문 조회
효 과 는 다음 과 같다. http://flowplayer.org/tools/demos/tabs/wizard.html
이런 기능 은 특히 유용 하 다.
6. 다른 것 은 아코디언 효과 도 있 습 니 다. 스스로 발굴 하 세 요. 주 소 는 다음 과 같 습 니 다.
http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html
이 플러그 인의 다운로드 주 소 는 다음 과 같 습 니 다.
http://flowplayer.org/tools/download.html
jquery. tools. min. js 는 UI 기능 팩 이 고 다른 UI 효과 도 포함 합 니 다.
Tooltip: 좋 은 알림 기능 플러그 인
Scrollable: 스크롤 효과 플러그 인
Overlay: 사용 하기 좋 은 커버 플러그 인
Expose: 배경 이 어 두 워 지 는 효과
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
