>  기사  >  웹 프론트엔드  >  jQuery UI library_jquery를 사용한 웹 인터페이스 개발에 대한 간단한 가이드

jQuery UI library_jquery를 사용한 웹 인터페이스 개발에 대한 간단한 가이드

WBOY
WBOY원래의
2016-05-16 15:04:171278검색

1. jQuery UI
jQuery UI는 jQuery를 기반으로 하는 오픈 소스 JavaScript 웹 사용자 인터페이스 코드 라이브러리입니다. 패키지
낮은 수준의 사용자 상호 작용, 애니메이션, 특수 효과 및 테마 지정이 가능한 컨트롤이 포함된 시각적 컨트롤입니다. 이를 직접 사용하여 매우
매우 대화형 웹 애플리케이션입니다.
jQuery UI의 공식 웹사이트는 다음과 같습니다: http://jqueryui.com/
jquery-ui-x.xx.x.custom.zip
. 내부 디렉토리 구조는 다음과 같습니다.
1.css(jQuery UI 관련 CSS 파일 포함)
2.js(jQuery UI 관련 JavaScript 파일 포함)
3. 여러 가지 하위 디렉터리를 포함하는 개발 번들: 데모(jQuery UI 샘플 파일), 문서(jQuery
UI 문서 파일), 테마(CSS 테마 파일) 및 ui(jQuery ui JavaScript 파일)입니다.
4.Index.html에서는 jQuery UI 함수의 인덱스 페이지를 볼 수 있습니다.

2. CSS 테마
CSS 테마는 jQuery UI의 스킨으로, 다양한 색상의 템플릿을 사용할 수 있습니다. 프로그래머의 경우
를 사용할 수 있습니다. 아티스트를 위한 홈페이지에 가장 적합한 템플릿으로, 디자인에 따라 어떠한 스타일도 없는 템플릿도 제공됩니다.
기존 템플릿 스타일은 http://jqueryui.com/themeroller/에서 볼 수 있습니다.

3.간단한 소개
jQuery UI의 다양한 구성 요소 도입은 기능과 구문이 유사하므로 여기서는 두 가지 구성 요소만 소개합니다
도입 방법은 동일한 방식으로 다른 구성요소를 도입하는 데 사용될 수 있습니다.
버튼버튼

//将button 按钮设置成UI 
$('#button').button(); 

대화상자

//将div 设置成dialog 对话框 
$('#dialog ').click(function () { 
 
  $("#dialog ").dialog(); 
 
}); 

이러한 형태에서는 jQuery UI가 컴포넌트 name() 메소드 형태로 도입되었음을 알 수 있습니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.