본문 바로가기

분류 전체보기

[HTML] HTML / CSS 만을 이용하여 트리 뷰(tree view) 제작하기 #02 참고 : 자바스크립트 없이 tree 만들기 ■ HTML / CSS 만을 이용하여 트리 뷰(tree view) 제작하기 #02 01. 이전 예제에서 2단 트리 뷰를 만들어 보았다. 이번에는 3단 트리뷰를 만들어 보자. tree.html HTML / CSS를 이용한 트리 트리 카테고리 one1 one2 one3 one3-1 one3-2 one3-3 one3-4 one3-4-1 one3-4-2 one3-4-3 one3-4-4 one3-4-5 one3-4-6 one3-4-7 one3-4-8 one3-4-9 one3-5 one3-6 one3-7 one3-8 two1 two2 two2-1 two2-2 two2-3 two3 출력결과는 아래와 같다. 하지만 기본적인 ul, li 태그의 점, 블릿기호가 삽입된 모습니다... 더보기
[HTML] HTML / CSS 만을 이용하여 트리 뷰(tree view) 제작하기 #01 참고 : 자바스크립트 없이 tree 만들기 ※ 해당 글은 참고로 올려둔 생활코딩의 내용을 자체적으로 정리한 내용입니다. ■ HTML / CSS 만을 이용하여 트리 뷰(tree view) 제작하기 #01 01. 먼저 ul, li 태그와 checkbox를 이용하여 트리 구조를 만들어 보자. 코드는 아래와 같다. tree_01.html HTML / CSS를 이용한 트리 트리 카테고리 one1 one2 one3 one3-1 one3-2 one3-3 two1 two2 two2-1 two2-2 two2-3 two3 위 코드를 그대로 입력하면. 아래와 같은 결과의 트리 구조가 출력되는 것을 확인 할 수 있다. 02. 이제 체크박스를 check함으로서 체크박스의 창을 열고 닫고 하는 기능을 추가하여보자. tree_02.. 더보기
[jQuery] Datepicker(캘린더) 위치 수정 참고 : 서제떼의블로그 아래와 같이 jQuery 다이얼로그 창에서 jQuery Datepicker를 사용중에 Datepicker 캘린더의 위치가 텍스트박스 바로 아래가 아닌 이상한 곳에서 나타나는 에러가 발생했다. #01. 에러 상황 기존코드 jQuery("#calendar").datepicker({}) #02. 에러 해결방법 수정코드 jQuery("#calendar").datepicker({ beforeShow: function(input) { var i_offset = jQuery(input).offset(); // 클릭된 input의 위치값 체크 setTimeout(function(){ jQuery("#ui-datepicker-div").css({"left":i_offset}); // datepic.. 더보기
[JavaScript] 함수 실행시 특정 value 값 전달하기 ■ 함수 실행시 특정 value 값 전달하기 자바스크립트의 onClick 이벤트를 사용하여 특정 함수를 호출하는경우 해당 태그의 value 값을 넘겨주어야 하는경우 아래와 같이 사용한다. exercises.php (http://localhost/exercises.php?name=wicked&email=yinglong200) 더보기
[MySQL] FIELD를 사용한 ORDER BY 정렬 순서 강제 지정 ■ FIELD를 사용한 ORDER BY 정렬 순서 강제 지정 기본적으로 ORDER BY는 ASC, DESC 형태로 DB를 정렬하여 주지만. 상황에 따라. 1, 2, 3, 4, 5의 순서가 아닌 3, 5, 1, 4, 2의 순서로 나타내야 하거나. 정렬 순서가 문자로 구분되어질 필요가 있는경우 FIELD를 사용하는데 사용방법은 아래와 같다. 위와 같은 방법으로 아래와 같이 데이터를 불러오면 SQL > SELECT title, zone FROM test_table ORDER BY FIELD(zone, 'wg', 'ap', 'at', 'ag', 'tc', 'tw', 'ac', 'ht') ASC; 그럼 아래와 같이 위에서 지정한대로 wg부터 ~ ht의 순으로 출력되는 모습을 확인 할 수 있다. 더보기

티스토리툴바