일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- keep-all
- html5
- font-size
- 소스보기방지
- Filter
- 개발자도구함
- CSS
- css3
- 키보드방지
- meta
- onmouseup
- JavaScript
- Gallery
- IE8
- Ajax
- 모바일테스트
- jQuery
- box-shadow
- Mobile
- break-all
- mobile view
- 스크립트
- 웹표준 약도
- white-space:pre
- HTML
- font
- 웹표준
- view test
- onlosecapture
- word-break
- Today
- Total
감성 퍼블리셔 html,css
여러분들은 웹사이트/모바일 제작할때 제이쿼리나 CSS 보려고 F12를 통한 개발자 도구함을 통해 소스보기 해보신적 있으신가요? 저는 에이젼시 이전 멀티샵 쇼핑몰에서 근무할때 아주 일상이였습니다. 그때는 이렇다할 스킬과 웹표준에 대한 개념이 잡히기 전이라, 기획쪽에서 경쟁사 사이트에서 괜찮은 제이쿼리나 효과들이 있다면 바로 적용하길 바랬거든요..ㅎㅎ 덕분에 능력치에 버거운 경우도 많았지만 그런 연습기간이 있었기에 약간의 요령도 생겼던 것 같습니다.ㅎㅎ 이번에 단순한 태그 및 자바스크립트는 이런 소스보기를 방지하기 위한 태그입니다. 물론 100% 막지는 못하지만 어느정도의 간섭을 막아주죠~ 하단 자바스크립트 소스를 간단하게 연동하여 사용가능합니다. var ns = (document.layers)?true:f..
[Mobile] 모바일 화면 미리보기 Daum Troy plug-in 안녕하세요. 오랜만에 글 남깁니다. 요새 에이전시에서 퍼블리싱을 하다가 친한형님과 창업을 하게 되어 정신없이 지내고 있네요^^ 덕분에 퍼블리싱은 많이는 못하지만 간간히 모바일, 웹사이트 유지보수 개념으로 만지고 있네요.. 관련해서 제가 한창 퍼블리싱 할적에 도움이 많이 되었던 사이트 하나를 소개하려고 합니다. http://troy.labs.daum.net/ 이구요. 다음에서 제공하는 모바일별 화면 미리보기 플러그인입니다. 익스플로어 보단, 크롬, 사파리 등으로 확인해보심을 권장합니다.^^ 모바일 퍼블리싱을 하고 모바일 종류별로 체크를 하고 싶은데 환경적으로 어려움이 있을때 이 사이트를 이용하여 간략하게 체크할 수 있습니다. 물론 직접 ..
디자인 포트폴리오 관련 http://welldoner.blog.me/10186569472 http://www.publicdomainvectors.org 로고 및 심볼관련 http://www.brandsoftheworld.com http://seeklogo.com PSD 관련 http://www.freepik.com 일러스트 관련 http://www.freevectors.me/search/love http://www.fordesigners.com
자바 스크립트 구문 자바 스크립트 문장들은 다양한 구문으로 작성되어있습니다. 다음은 일부분의 스크립트 동작의 제어를 주는 몇가지 구문에 대한 목록입니다. 키워드 기술 break 스위치 나 루프를 종료 continue 루프 점프 상단에서 시작 debugger 자바 스크립트의 실행 및 호출 (사용 가능한 경우) 디버깅 기능을 중지 do ... while 조건이 true 인 동안, 문 블록을 실행하고 블록을 반복 for 문 블록이 실행되는 마크, 한 조건이 true 인 function 함수를 선언합니다 if ... else 마크 문장 블록은 조건에 따라 실행되는 return 기능을 종료 switch 마크 문장 블록이 다른 경우에 따라 실행되는 try ... catch 문장 블록에 오류 처리를 구현 var 변수..
text 관련 css 스타일 (줄바꿈 및 글자 자르기, 점선표기 등) white-space:normal; normal이 기본값, 여러칸의 공백이나 줄바꿈을 공백 1칸으로 인식한다. 지정된 넓이의 끝에서 자동으로줄바꿈한다. - 코드에서의 원래 텍스트 여수 밤바다 이 조명에 담긴 아름다운 얘기가 있어 네게 들려주고파 white-space:pre; 띄어쓰기는 실제 입력한 칸 수대로, 줄바꿈도 엔터를 친 대로 나온다. 넘어가는 부분에서 강제 줄바꿈은 되지 않는다. white-space:nowrap; 여러칸의 공백이나 줄바꿈을 공백 1칸으로 인식한다. 넓이를 지정하였어도 자동으로 줄바꿈 되지 않게 강제로 개행을 막아준다. word-break 텍스트가 들어가는 블럭요소의 넓이에 맞춰 줄바꿈 하는 CSS (강제 줄바..
네이버 API 지도 활용 먼저 하단의 주소에 네이버에서 제공하는 API키를 발급받습니다. https://developer.naver.com/openapi/register.nhn (API 키 발급받기) 위 페이지로 갔을시 항목중에 '지도 API 부분'에서 적용하고자 하는 사이트URL 로 발급키를 생성합니다. 해당키값 + 노출하고자 하는 주소지를 아래와 같은 형식으로 검색! http://openapi.map.naver.com/api/geocode.php?key=발급받은키&encoding=euc-kr&coord=LatLng&query=검색주소지 샘플주소 : http://openapi.map.naver.com/api/geocode.php?key=test&encoding=utf-8&coord=tm128&query..
마우스 관련 jQuery 및 javascript 이벤트 목록 (Mouse event) 내용이 누락된것이 있을 수 있지만, 최대한 모아놓것을 정리한것이다. 제이쿼리를 사용할시 일부 기능에 따라 커스텀 할때 부분적으로 수정을 해야할때가 있다. 이때 조금이라도 도움이 될 수 있도록 Mouse 관련 이벤트 항목을 몇개 정리해보았습니다. 이벤트명 발생내용 및 설명 onmousedown 마우스가 개체 위를 눌렀을 때 발생 목록 참조 onmouseenter 사용자가 마우스포인터로 개체 위에 들어갔을 때 발생 목록 참조 onmouseleave 마우스포인터가 개체의 범위 밖으로 이동하면 발생 목록 참조 onmousemove 마우스가 개체 위에서 이동하였을 때 목록 참조 onmouseout 마우스가 개체 위에서 이탈하였을..
웹접근성을 통과하기 위해선 마우스를 사용하지 않고, 키보드 tab키만으로도 모든 객체에 접근이 가능해야만 한다. 이에 tab키에 의한 동작이 순서에 따라 이동되지 않을때, 페이지가 로딩될 시 tabindex를 적용하여 순차적인 이동이 가능하도록 하는 태그이다. tabindex=”1″ 문서 안에서 가장 먼저 초점을 받을 수 있습니다. 그러나 자연스러운 마크업 순서를 거스르기 때문에 주의해서 사용해야 합니다. 검색엔진 사이트에서 검색창에 사용하면 적합하지만(이 대신 autofocus=”autofocus” 속성이 더 적절할 듯 해요) 그 외 적합한 경우는 잘 떠오르지 않는군요. tabindex=”0″ 키보드 초점을 받을 수 없는 div, span과 같은 요소도 초점을 받을 수 있도록 만들어 줍니다. 초점을 받..