PowerMockup
인터넷과 모바일의 개발자가 아니더라도 의뢰의 목적이거나. 아님. 자신의 아이디어의 정리를 위하여 스토리보드 형식으로 정리하는 것이 필요하다. 나의 경우 파워포인트를 이용하여 사각형과 원등의 도형과 텍스트를 이용하여 표현하여 왔습니다. 그러던 차에. 와이어프레밍이라는 종류의 프로그램이 존재 한다는것을 알게되고. 여러 종류를 접해보았습니다. 그중 저와 상생이 맞는것은 Power Mock-Up 일단 제일 좋은 것은 설치하면 파워포인트안에서 사용할 수 있는 것입니다. 설치 후 메뉴의 맨 우측에 PowerMockup 이라는 메뉴가 새롭게 생겼습니다. 사용법은 간단합니다. 우측에 있는 PowerMockup Shapes에서 필요한 도형을 클릭후 옮기면 됩니다. 그리고 필요한 텍스틀 변경하면 됩니다. 도형은 여러가지 ..
이 강좌는 월간 w.e.b. HOW TO 2011년 02호에 게재되어 있습니다.언제부터인가 우리의 웹은 이미지에 의존하는 웹페이지, 또한 당연하다는 듯이 각종 오브젝트 타입의 컨텐츠를 무분별하게 사용하여 무거운 웹사이트를 구축했었고 또, 대부분의 웹사이트들은 웹표준이나 웹접근성 보다는 화려한 그래픽으로 특정브라우저에 맞춰진 Content Design으로 처리해 왔다.그러나 기존 포토샵 같은 이미지편집 Tool이나 플래시 같은 모션그래픽 툴로 밖에 할 수 없었던 효과들이 CSS3를 사용함으로써 많은 부분 코드 몇 줄 만으로 가능하게 되었다.같은 조건의 서비스라면 더 가벼워지고 빠른 로딩속도는 덤으로 가질 수 있게 된 건 물론이다.이번 연재에서는 기본적이지만 매우 중요한 선택자의 종류와 몇 가지 CSS3 주..
CSS: 선택자(Selector) 이해 Nextree Mar 31, 2014 2 Comments 웹 표준은 이제 더 이상 무시할 수 없는 키워드입니다. World Wide Web(WWW)의 의미대로 가능한 많은 사람이 웹을 이용하기 위해서는, 모든 브라우저에서 ‘똑같이 보이는 것’이 아니라 ‘각 브라우저에 알맞게 보이는 것’이 중요하기 때문입니다. 그래서 웹 표준에서는 구조(Constructure)와 표현(Presentation)과 행위(Behavior)를 각각 분리해서 개발하기를 권유합니다. 이렇게 하면, 각 사용자는 구조화 된 마크업에 따라 다양한 디자인을 제공받을 수 있기 때문입니다. 뿐만 아니라 사이트의 로딩속도도 빨라지고 개발과 유지보수 또한 쉬워집니다.구조 : 웹 콘텐츠에 의미를 부여하고 구조..
[정보] jquery.validator 정리 출처:http://phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=72358수리도랑님jquery.validator Option 정리 debug기본값: false디버그 할 수 있도록 입력값이 유효해도 submit 하지 않는다 $(".selector").validate({ debug: true }) submitHandler폼이 submit 될때 마지막으로 뭔가 할 수 있도록 핸들을 넘겨준다.$(".selector").validate({ submitHandler: function(form) { $(form).ajaxSubmit(); } }) invalidHandler입력값이 잘못된 상태에서 submit ..
addslashes() 함수와 그와 반대되는 stripslashes() 함수 DB 작업을 하기 위해서 쿼리를 작성하게 되는데, 이때 DB 시스템은 작은따옴표 ' 와 큰따옴표 " 그리고 백슬래시 / 그리고, NULL byte 를 문자열을 구분하는 등의 기준으로 이용하게 됩니다. 그런데, 하나의 문자열 안에 따옴표가 들어가 있게되면, 예상치 못하게 오류가 발생하게 됩니다. 그래서, 문자열을 데이터베이스에 저장할 수 있는 포맷으로 변화시켜줄 필요가 있습니다. 예를 들면, I'm a boy 를 문자열로 지정해서 'I'm a boy' 이렇게 쿼리로 전송되게 되면, I 뒤의 작은 따옴표 때문에 오류가 발생하게 됩니다. 그래서, 내부에 위치하게 될 따옴표들을 기준을 가지고 다르게 표현을 해 줘야합니다. 흔히들 이스케..
목차 [숨기기] 1 개요2 같이 보기개요[편집] jQuery - HTML 요소 개수 jQuery - input text 개수 확인 jQuery - input 배열 수 세기 $("#my_button").click(function() { alert($("input[name=tag]").length); }); 같이 보기[편집]jQuery checkbox 모두 체크jQuery 셀렉터 해당 개수 세기JavaScript input 개수 세기 [http://fruitdev.tistory.com/192]자바스크립트로 스크립트를 만들다 보면 생각외로 종종 input 배열의 값을 컨트롤 해야 할때가 있다. Input 배열은 동일 페이지 내에서 Input으로 정의되는 항목에 대하여 중복되는 Name이 존재할경우 배열처럼 사..
가끔 jQuery 사용시에 특정 상위 객체를 가져와야 하는 때가 종종 있다. 까먹지 않게 포스팅.1. ExamplejQuery에서 특정 상위 객체를 가져오는 방법은 여러가지가 있으니 하나씩 알아보자. 우선 예제로 쓸 HTML 페이지 구성은 아래와 같다. 이제부터 이 예제 코드를 가지고 다음의 함수들을 살펴보자.2. $(selector).parents(selector)parents 함수는 parents 인자값으로 잡히는 모든 상위 요소를 반환한다. 예를들자면, 예제 HTML 코드처럼 div 태그가 중첩되어 있을때 $("#test").parents("div")를 실행하면 결과 객체는 배열이 나온다. 즉, 셀렉터selector로 잡히는 모든 상위 요소를 반환한다.반환된 배열에는 parent1 div, pare..
1. 노드 찾기 - 태그 이름으로 노드 찾기 : $("태그이름"), $("선택자") - 클래스 이름으로 노드 찾기 : $(".클래스이름") - ID로 노드 찾기 : $("선택자") - 속성으로 노드 찾기 : $("[속성이름=값]") - 찾은 요소 개수 구하기 : .size() , .length - 찾은 요소 n번째 접근하기 : .eq(index) , .each(function(index){}); - 찾은 요소에서 특정요소만을 걸러내기 : .filter("선택자") - 찾은 요소에서 특정 자식요소만 찾기 : .find("선택자") 2. 자식 노드 찾기 - 전체 자식 노드 찾기 -- 텍스트 노드 포함 전체 자식 노드 찾기 : $("선택자").contents() -- 텍스트 노드 제외한 전체 자식 노드 찾기 ..
form과 input 태그를 통해서 배열을 넘기는 것을 의외로 간단하다. input 태그에 있는 name 속성에 변수명 및 대괄호[]를 이용해서 작성한다. 다음 예제를 통해서 확인하자. array[0] array[1] array[2] 위의 예제를 통해서 값을 전송하게 되면, PHP와 같은 경우 위의 값을 다음 코드를 통해 출력할 수 있다. print_r($array); 또는 print_r($_POST['array']); 의 두 가지 방법 모두 가능하다. 하지만 Form태그의 Method 값이 GET인 경우는 배열을 넘길 수가 없으니 $_GET은 무용지물임을 명심하기 바란다. 상단 코드의 실행..