'[프로그래밍]/- etc'에 해당되는 글 3건

  1. 2010.04.06 jQuery 갤러리 테스트
  2. 2010.04.06 jQuery test
  3. 2009.09.15 jQuery Datepicker (달력소스)
jQuery Tools standalone demo

신고
Posted by 쵸류빈
jQuery Tools standalone demo

First pane

Flying screens

Aenean nec imperdiet ligula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Suspendisse potenti. Sed elementum risus eleifend massa vestibulum consectetur. Duis massa augue, aliquam eget fringilla vel, aliquam vitae arcu. Nam sed magna mi. Praesent odio neque, dapibus sit amet suscipit at, tempus sed nibh. Aliquam sagittis ligula in ligula faucibus cursus. Quisque vulputate pellentesque facilisis.

Second pane

Flying screens

Consectetur adipiscing elit. Praesent bibendum eros ac nulla. Integer vel lacus ac neque viverra.

Vivamus euismod euismod sagittis. Etiam cursus neque non lectus mattis cursus et a libero. Vivamus condimentum hendrerit metus, a sollicitudin magna vulputate eu. Donec sed tincidunt lectus. Donec tellus lectus, fermentum sit amet porta non, rhoncus ac mi. Quisque placerat auctor justo, a egestas urna tincidunt eleifend.

Third pane

Non lectus lacinia egestas. Nulla hendrerit, felis quis elementum viverra, purus felis egestas magna.

Aenean elit lorem, pretium vitae dictum in, fermentum consequat dolor. Proin consectetur sollicitudin tellus, non elementum turpis pharetra non. Sed quis tellus quam.

신고
Posted by 쵸류빈

source file:






<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
     "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>jQuery Datepicker</title>
<style type="text/css">
@import "css/jquery.datepick.css";
/* Or use these for a ThemeRoller theme
@import "themes16/southstreet/ui.all.css";
@import "css/ui-southstreet.datepick.css";
*/
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.datepick.js"></script>
<script type="text/javascript" src="js/jquery.datepick-ko.js"></script>
<script type="text/javascript">
$(function() {
// $.datepick.setDefaults({useThemeRoller: true});
 $('#popupDatepickerStart').datepick();
 $('#popupDatepickerEnd').datepick();
 $('#inlineDatepicker').datepick({onSelect: showDate});
});

function showDate(date) {
 alert('The date chosen is ' + date);
}
</script>
</head>
<body>
<h1>jQuery Datepicker</h1>
<p>This page demonstrates the very basics of the
 <a href="http://keith-wood.name/datepick.html">jQuery Datepicker plugin</a>.
 It contains the minimum requirements for using the plugin and
 can be used as the basis for your own experimentation.</p>
<p>For more detail see the <a href="http://keith-wood.name/datepickRef.html">documentation reference</a> page.</p>
<p>A popup datepicker <input type="text" id="popupDatepickerStart"> ~ <input type="text" id="popupDatepickerEnd"></p>
<p>Or inline</p>
<div id="inlineDatepicker"></div>
</body>
</html>

localization을 위해서 각 나라별 언어파일을 각각 만들어놓는 배려를 해줬다.

<script type="text/javascript" src="js/jquery.datepick-ko.js"></script>

한국어를 위해서 위와 같이 스크립트를 추가해주면 간단히 한글로 바뀐다 ^^
* jquery.datepick.js 요녀석을 열어보면 날자 포맷부터 다양한 셋팅을 변경할 수 있다.

생김새는 아래 스샷을 참고.


사용자 삽입 이미지



 

신고
Posted by 쵸류빈