jQuery�ƁA���̃v���O�C���̎g�������AUI���ʁi�G�t�F�N�g�j�̃e�[�}���ƂɏЉ��A�ځBjQuery/JavaScript/HTML�R�[�h�����ł͂Ȃ��ACSS�̏�������������邱�ƂŁA�����H�I��jQuery�v���O�C�����g�����߂̎Q�l�h�L�������g�ɂȂ邱�Ƃ�ڎw���Ă��܂��B
�@�O��́u�摜�⓮����Y��ɉ�]/�g�傷��jQuery�v���O�C���v�ł́A�C���[�W����]��������Y�[���C������ujCarousel�v�uZoombox�v�v���O�C���̎g������������܂����B����́A�t�H�[�����g���₷�����邽�߂̊e��v���O�C�����A�ȉ��̂悤�Ƀ`�F�b�N�{�b�N�X�^���W�I�{�^���A�h���b�v�_�E�����X�g�A�e�L�X�g�{�b�N�X�^�e�L�X�g�G���A�A�t�H�[���̃J�e�S���ʂɕ��ނ��ďЉ�܂��B
�@�`�F�b�N�{�b�N�X��jQuery���uCheckbox�v�v���O�C����K�p����ON/OFF�̃C���[�W�ŕ\�����܂��B
�@Web�u���E�U���N�����ăT���v����\������ƁA�`�F�b�N�{�b�N�X��ON/OFF�ŃC���[�W������ĕ\������܂��BON/OFF�̃C���[�W�Ƀ}�E�X���ړ�����ƁA���E�ɓ����܂��B���x���܂��̓C���[�W���N���b�N�����ON/OFF�ɐ�ւ��܂��B
�@���D�݂̊J���c�[���܂��̓G�f�B�^���N�����āA�V�K�t�@�C�����쐬������A<head>�v�f��<link>�v�f��<script>�v�f��lj����āACSS��jQuery�̃��C�u������g�ݍ��݂܂��B
<head> <link href="style.css" rel="stylesheet" type="text/css" />�c�c�y1�z <link href="jquery.checkbox.css" rel="stylesheet" type="text/css" />�c�c�y2�z <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>�c�c�y3�z <script src="jquery.checkbox.js" type="text/javascript"></script>�c�c�y4�z </head>
�@Checkbox�v���O�C���̍ŐV�ł́A���L�T�C�g����_�E�����[�h�ł��܂��B
�@<body>�v�f��<input>�icheckbox�j�v�f��<label>�v�f��lj����ă`�F�b�N�{�b�N�X��z�u���܂��B<label>�v�f��for�����ɂ́A<input>�icheckbox�j�v�f��id�icheck1�j��ݒ肵�܂��B�����ł́Achecked�����Ɂuchecked�v��ݒ肵�ă`�F�b�N���ꂽ��Ԃɂ��Ă��܂��B���l�̎菇�ŕ����̃`�F�b�N�{�b�N�X��z�u���܂��B<input>�icheckbox�j��name�����ɂ́A���j�[�N�i��Ӂj�Ȗ��O��ݒ肵�܂��B
<input id="check1" name="checkbox.1.1" type="checkbox" checked="checked" /> <label for="check1">�`�F�b�N�ς�</label>
�@<head>�v�f��<script>�v�f��lj�������A���̂悤�ȃR�[�h��lj�����Checkbox�v���O�C����g�ݍ��݂܂��B�����ł́AjQuery���Z���N�^�uinput:checkbox�v�Ń`�F�b�N�{�b�N�X�̗v�f���������āAcheckbox()���\�b�h�����s���Ă��܂��B
<script type="text/javascript"> $(function() { $('input:checkbox').checkbox(); }); </script>
�@����ŁA��قǂ̃T���v�����o���オ��܂����B
�@<input>�iradio�j�v�f��name�����ɓ������O�iradio.1�j��ݒ肵�܂��B����ŁA�����̃��W�I�{�^�����O���[�v�������1�����I���ł���悤�ɂȂ�܂��i���s�T���v����\���j�B
<label><input name="radio.1" value="1" type="radio" />���W�I�{�^�� #1</label> <label><input name="radio.1" value="2" type="radio" />���W�I�{�^�� #2</label> <label><input name="radio.1" value="3" type="radio" />���W�I�{�^�� #3</label>
$('input:radio').checkbox();
�@<select>�v�f�Ńh���b�v�_�E�����X�g��\������ƁA���������I�Ɉ�Ԓ����A�C�e���ɒ�������܂��B���̕s�s�����������ɂ́A<select>�v�f��jQuery���ucombobox�v�v���O�C����K�p���܂��B
�@Web�u���E�U���N�����ăT���v����\��������A�R���{�{�b�N�X�́u���v���N���b�N���ăA�C�e����\�����܂��B�A�C�e����\�����镝���g������ăh���b�v�_�E�����X�g�ɕ\������܂��B�h���b�v�_�E�����X�g�ɂ́A�A�C�e�����������ŕ\������܂��B�A�C�e�����N���b�N����ƁA�R���{�{�b�N�X�ɕ\�����ăh���b�v�_�E�����X�g����܂��B
�@���D�݂̊J���c�[���܂��̓G�f�B�^���N�����āA�V�K�t�@�C�����쐬������A<head>�v�f��<script>�v�f��lj����āAjQuery�̃��C�u������g�ݍ��݂܂��B
<head> <script src="scripts/jquery-1.1.3.1.js" type="text/javascript"></script>�c�c�y1�z <script src="scripts/jquery.dimensions.js" type="text/javascript"></script>�c�c�y2�z <script src="scripts/jquery.combobox.js" type="text/javascript"></script>�c�c�y3�z </head>>
jquery.combobox via kwout
�@<body>�v�f��<select>�v�f��lj�������<option>�v�f��<optgroup>�v�f�����q�ɂ��ăA�C�e�����`���܂��B�����ł́AjQuery API�̃J�e�S�����A�C�e���Ƃ��Ē�`���Ă��܂��B�uCSS�v�̃A�C�e���́A<optgroup>�v�f�ŃO���[�v�����Ă��܂��B
<select id="jqueryAPI"> <option value="1">jQuery core</option> <option value="2">Attributes</option> <option value="3">Traversing</option> <option value="4">Manipulation</option> <optgroup label="CSS"> <option value="5">CSS</option> <option value="6">Positioning</option> <option value="7">Height and Width</option> </optgroup> �c�y���z�c </select>
�@<head>�v�f��<script>�v�f��lj�������A���̂悤�ȃR�[�h��lj�����combobox�v���O�C����g�ݍ��݂܂��B�����ł́AjQuery�̃Z���N�^�u#jqueryAPI�v��<select#jqueryAPI>�v�f���������āAcombobox()���\�b�h�����s���܂��B
<script type="text/javascript"> $(function() { $('#jqueryAPI').combobox(); }); </script>
�@�h���b�v�_�E�����X�g�̕��́A<div>�v�f��width�v���p�e�B�ɐݒ肵�܂��B�����ł́Awidth�v���p�e�B�Ɂu300px�v��ݒ肵�Ă��܂��B
<div class="liveexample" style="width:300px;"> <select id="jqueryAPI"> </select> </div>
�@�R���{�{�b�N�X�̕��́Acombobox()���\�b�h�̈���width�I�v�V�����Ɏw�肵�܂��B�����ł́A�R���{�{�b�N�X�̕����u100px�v�ɐݒ肵�Ă��܂��B���̃��\�b�h�̈�����animationType�I�v�V������lj�����ƁA�h���b�v�_�E�����X�g��\������Ƃ��ɃA�j���[�V�������ł��܂��B
$('#jqueryAPI').combobox({ animationType: "fade", // �A�C�e����W�J����Ƃ��A�j���[�V���������� width: "100px" // �R���{�{�b�N�X�̕����w�� });
�@����ŁA��قǂ̃T���v�����o���オ��܂����B
�@���y�[�W�ł́A�e�L�X�g�{�b�N�X���g���₷������v���O�C���Ƃ���Form Tips�AWatermark Input�̎g������������܂��B
Copyright © ITmedia, Inc. All Rights Reserved.