먹고살거 (108) 썸네일형 리스트형 slide 2개씩 보여야할때 $(document).ready(function(){//slide샘플var testNum = 0,testWidth = $("div.slider ul li").width(),testLength = $("div.slider ul li").length,totalWidth = testWidth * testLength;var guideWidth = $("div.slider div").outerWidth(); if(testLength > 2){$("div.slider a.left").show();}$("div.slider div ul").css("width",totalWidth); $("div.slider a.left").click(function(){testNum--;console.log(testNum);if (.. 항목추가/삭제 위치 상하이동 $(document).ready(function(){//항목추가$(".btn_add").click(function(){var html = '';html += '';html += '위로이동 ';html += '아래로이동 ';html += '';html += '선택';html += ' ';html += ' ';html += '삭제';html += '';$("div.add").append(html);});});//항목삭제$(document).on("click",".btn_del",function(){$(this).parent().remove();});//항목 위치 위로이동$(document).on("click",".btn_up",function(){console.log("위로이동");var test = $(t.. Html5 input placeholder ie9 처리 IE9 브라우져에서는 placeholder가 보이지 않는다그래서 브라우져 체크를 한다음 placeholder값을 value에 넣어주는것이다 -----------------------------------------------------------------------------$(document).ready(function(){$.each($.browser,function(i,val) {if ($.browser.msie) {if ($.browser.version == 9.0){$("input").each(function(){var test = $(this).attr("placeholder");$(this).attr("value",test); $(this).focus(function(){$(this).at.. Portfolio(최신순) ◆ 리틀팍스 구축 및 운영(PC,Mobile)기간 2018.02 ~ 현재#운영 - 리틀팍스 영어 및 글로벌(KR/EN/CN/HK/TW/JP) 운영 - 팍스스쿨 운영(대표/학교/본사학교) - 어학원 운영(대표/센터별/CMS/원어민채용모바일) #구축 및 개편 - 어학원 채용 웹사이트 구축 PL - HTML5 플레이어 구축 PL (리틀팍스 영어 및 중국어, 팍스스쿨, 어학원) - 카테고리 개선 PL (리틀팍스 영어 및 글로벌, 팍스스쿨, 어학원CMS) ◆아시아나항공 개편 퍼블리싱 QA기간 2017.07~2018.01https://flyasiana.com/ ◆한국스마트카드STIS PMO 기간 2017.07~2017.10사내 사이트 ◆한국중부발전 개편 PL 기간 2017.01~2017.05https://www.k.. [Jquery] noConflict() 다른언어와 제이쿼리의 "$"기호가 충돌되는 경우. 제이쿼리의 별칭을 변경하여 충돌을 방지한다. [CSS3] 새로운 CSS3 CSS3의 소개 및 새롭게 추가된 기능 알아보기 HTML에서 지원하지 못했던 타이포그래피,레이아웃.배경 이미지와 같은 디자인을 구현할수 있는 용도로 사용되는 CSS이다. 웹페이지 제작에 있어서 HTML과 함께 중요한 마크업 언어입니다. 특히, CSS3는 추가되는 선택자와 속성,값에 따라 웹 브라우져 별로 지원되는 -webkit-,-moz-와 같은 벤더 프리픽스를 사용해야만 합니다. 하지만, 기존의 CSS2가 가지지 못했던 포토샾과 자바스크립트 기술에만 의존하던 다양한 영역의 기술을 구현할 수있다는 큰 장점이 있습니다. CSS3의 핵심적인 특징 CSS2와 CSS3의 큰 차이점 중 하나는 모듈 기반으로 개발되고 있어 다양한 웹브라우져나 디바이스의 필요에 따라 원하는 CSS 모듈만을 탑재 할수 있다는 점입니다.. [웹지식]육하원칙으로 풀어보는 웹접근성 1.Who 웹접근성, 누구를 위해 해야 되는가? 2.When 웹접근성, 언제부터 해야 되는가? 3.Why 웹접근성, 왜 해야 되는가? 4.What 웹접근성. 무엇을 고려해야 되는가? 5.How 웹접근성. 어떻게 해야 되는가? 6.Where 웹접근성. 어디서 확인할 수 있나? 7.FAQ -웹표준과 웹접근성은 같지 않다. 웹표준은 웹접근성에 포함되어있는 요소이다. -웹접근성 인증마크를 획득했다고 하여 장차법 대응이 100% 된것은 아니다. -웹접근성 인증은 매년 이루어지기 떄문에 매년 갱신을 해야한다. -웹접근성 품질인증을 받지 못했다고 웹접근성을 준수하지 않았다는건 아니다. [웹지식]액티브X 이 골칫덩어리~~~ 액티브X 윈도 사용자들이 인터넷을 쉽고 편리하게 이용하도록 마이크로소프트사에서 개발한 것으로, 기존의 응용 프로그램으로 작성된 문서 등을 웹과 연결시켜 그대로 사용할 수 있게 하는 기술. 인터넷 익스플로러를 위해 고안되었으며, 실생활 페이지에 접속하면 자동으로 내려받기되어 설치된다. 선 마이크로시스템스사의 자바(Java)에 대항하는 기술이다. 윈도8과 함께 온 IE10…액티브X∙플래시의 운명은? 터치에 최적화된 새로운 IE에서는 액티브X 플러그인이 지원되지 않는다. 회사 측은 “터치에 최적화된 IE10에서 별도의 플러그인을 설치하는 불편을 줄여 사용자 경험의 편리성을 증대하고, 배터리 수명 증가, 사용자의 보안, 신뢰성 및 개인정보 보호 향상을 이룰 수 있다” 고 설명했다. http://www.ddail.. [웹지식]정부 HTML5전문가 양성, 빛좋은 개살구? HTML5가 웹표준의 중심에 서는 것일까????? 양성의 궁극적인 목표가 무엇인지 궁금해졌다. 이글에서는 양성만이 목표인것처럼 느껴진 말그대로 빛좋은 개살구 같은 느낌이였다. 내용상 이대로라면 정부는 10년쯤 전에 웹퍼블리셔를 양산했던 경험을 되살려 HTML5 태그 몇개와 기초 자바스크립트 문법을 포함해 급조된 강좌를 HTML5 전문인력 양성과정으로 포장할 가능성이 높다. 라는 구문이 눈이 띄였다. 지금의 양성이 목표의 끝이 아니였음 좋겠다. 본문내용 HTML5가 주목되는 기술로 떠올랐지만 당장 제대로 구현할 인력을 찾기 어려운 상황이다. 이에 정부가 기술 전문가 양성과 민간확산을 약속했지만 업계가 중시하는 방향과 거리가 멀다는 비판이 나온다. 콘텐츠 유통 채널과 애플리케이션(이하 앱) 플랫폼으로 발전할.. [웹지식]아이애드·아이클라우드, HTML5 옷 걸치나 애플이 HTML5 웹 및 웹 앱 디자인 업체인 파티클(Particle)을 인수했다고 17일(현지시간) 테크크런치 등 주요 외신들이 전했다. 파티클은 HTML5를 활용한 웹 앱 개발과 마케팅 프로젝트 전문회사로 그동안 애플 뿐만 아니라 구글, 아마존, 야후, 모토로라, 소니, 징가 등 굵직한 IT 기업들을 주 고객으로 HTML5 작업을 대행해 왔다. 후어..이제 빼도 박도 못하는 상황이다. 해야된다.html5! 원본 http://news.inews24.com/php/news_view.php?g_serial=697391&g_menu=020600 [HTML5] Content Model Content Model 콘텐츠 모델이란 HTML의 각 요소가 어떠한 성격을 가지고 있으며, 어떤 역할을 하는지에 대한 그룹을 분류한 것을 말한다. HTML5의 Content Model과 사용성격 Content Group Element의 사용 성격 Flow Group 웹 페이지에 표시되는 콘텐츠 전반 요소 Heading Group 페이지 또는 문단의 제목으 표시하는 요소 Sectioning Group 내용의 범위를 구분하는 요소 Phrasing Group 태그안에 내용을 직접 출력하는 요소와 텍스트 Embedded Group 외부의 요소를 불러들여 표시하는 요소 Interactive Group 사용자와 상호 작용을 하는 요소 Metadata Group 메타 정보를 제공하는 요소 *중복도 될수가 있다는거~.. [모바일]웹과 앱의 차이점 [모바일]웹과 앱의 차이점 -앱(App) 스마트폰이나 태블릿 pc에서 언급하는 앱(APP)는 응용 프로그램을 뜻하는 어플리케이션(application)의 줄임말이다. -웹(Web) 웹은 기본적으로 HTML 태그(tag)로 이루어진 정보 체계이다. 차이점 모바일 앱은 사용자가 장치에 다운로드를 받아 설치해야 해서 제한적 모바일 웹은 브라우져만 있다면 어디서든 접속 가능하다 모바일 웹보다 모바일 앱이 빠르다. 1) 모바일앱 모바일 앱은 장치에 설치되는 어플리케이션이다. 일반적으로 많이 알려져있는 무료메신져 앱, 카메라 앱, 맛집 앱 등은 순수 모바일앱의 일종이라 할 수 있다. 2) 모바일웹 모바일 웹은 말그대로 모바일에서 보이게 만든 웹사이트를 말한것이다. 유명 포털사이트나 특정한 목적을 갖고 있는 웹사이트.. [Jquery]resize란 무엇인가? 컨텐츠에서 페이지 이동없이 어떤 컨텐츠를 보여주어야할때, 세로가 기존컨텐츠보다 넘어설때가 있다. 그럴때? [웹지식]시멘틱한 웹 시멘틱 웹 [ semantic web ] 컴퓨터가 정보자원의 뜻을 이해하고, 논리적 추론까지 할 수 있는 차세대 지능형 웹. 현재의 컴퓨터처럼 사람이 마우스나 키보드를 이용해 원하는 정보를 찾아 눈으로 보고 이해하는 웹이 아니라, 컴퓨터가 이해할 수 있는 웹을 말한다. 즉 사람이 읽고 해석하기에 편리하게 설계되어 있는 현재의 웹 대신에 컴퓨터가 이해할 수 있는 형태의 새로운 언어로 표현해 기계들끼리 서로 의사소통을 할 수 있는 지능형 웹이다. 원리는 사람들이 이해할 수 있도록 자연어 위주로 되어 있는 현재의 웹 문서와 달리, 정보자원들 사이에 연결되어 있는 의미를 컴퓨터가 이해할 수 있는 형태의 언어로 바꾸는 것이다. 이렇게 되면 컴퓨터가 정보자원의 뜻을 해석하고, 기계들끼리 서로 정보를 주고받으면서 자.. [CSS가이드] 개념 1.스타일 시트란? -HTML문서에 CSS를 적용하면 깔끔해진다. -계단형 스타일 시트(Cascading Style Sheets)이다. -그림이나 레이어에 적용하여 웹 페이지를 동적으로 다이나믹하게 구성 할수있다. 1.1 스타일 시트로 가능한 작업 -스타일 시트는 일정한 기능들을 미리 지정하여 여러 부분에서 동일하게 사용할수 있다. -반복되는 속성을 일괄적으로 지정하기 때문에 수정하기 수월하다. *스타일 시트로 가능한 작업 -HTML 문서 내에 글자의 글꼴 종류, 크기, 색, 여백 등을 지정. -글자의 정렬 방식을 결정하거나 글자에 그림자를 지정하는 등 다양한 효과를 줄 수 있다. -박스에 다양한 효과를 줄 수 있다. -사용자의 웹 브라우저 환경에 상관없이 일정한 화면을 보여줄 수 있다. 2.스타일 시트.. 퍼블리셔들의 지침서 리스트업~! 상식 & 팁-웹표준교과서-웹 접근성 & 웹 표준 완벽 가이드-읽기 좋은 코드가 좋은 코드다 : 더 나은 코드를 작성하는 간단하고 실전적인 테크닉-웹사이트 해부하기 : 실무에 적용하는 인터랙션 디자인 프레임워크 실무 마크업-HTML & CSS(실전 홈페이지 제작을 위한 파워테크닉)-웹표준 핵심가이드북 XHTML+CSS(웹 접근성에서 크로스 브라우징까지)-만들면서 배우는 HTML5 + CSS3 + jQuery -실력이 탐나는 드림위버 CS5 HTML CSS (2011) 실무 구현-다이내믹한 웹표준 사이트를 위한 DOM스크립트-자바스크립트 완벽 가이드-거침없이 배우는 자바 스크립트-jQuery Mobile-사전처럼 바로 찾아 쓰는 jQuery 모바일-모바일 애플리케이션 UX & UI 디자인 프로젝트 -HTML.. [자바스크립트]마우스 onblur() onfocus() 간단한거 같으면서도 어려운 객체이다. -onblur 클릭전 기본 세팅-onfocus 마우스클릭했을때 *스크립트 안쓸때html *스크립트 쓸때javascripthtml [HTML5] Markup – Form Controls 반응형이 너무 어렵다. 사실 하던것과 달라서 무서운 것이겠지 ㅠㅠㅠㅠㅠㅠㅠ 하아 어렵다............... 이글을 읽고 내가 조금이라도 이해할수 있는것인가. HTML5 Markup – Form Controls HTML5 Form의 위력은 아이폰을 사용하는 분들이면 쉽게 체감할 수 있습니다. 제 블로그에서는 다음과 같은 타입의 Form Control을 사용 했습니다. 제 블로그의 End-user 페이지에서 Form Control 이라고 해 봐야 검색창과 글쓰기창 뿐인데요. 적용 결과는 다음과 같습니다. 검색창의 인풋 타입이 search 입니다. 댓글 쓰기 창에서 웹 사이트 주소 입력 인풋 타입이 url 입니다. 이 밖에도 HTML5에는 새롭게 추가된 다양한 input type이 있습니다. 아래 항목.. [Jquery]tab구현-버젼2 Jqueryfunction branchSubMain(){var branchNum = jQuery(".lecture_cont").length;//목록 갯수var branchUnitW = jQuery(".lecture_cont").width();//목록 넓이var branchUnitNum = jQuery(".lecture_list_test .lecture_cont").length;//목록 갯수var branchArea = jQuery(".recom_lecture_menu");//페이징 버튼 ulvar branchContSet = jQuery(".lecture_list_test");//목록 부모박스if(branchUnitNum > 2){ //두개 이상부터 버튼 생성for(var i=1; i[1송파점] 트니트니.. [Jquery]tab구현-버젼1 Jquery$(function() {//인기/추천강좌 상단 배너롤링$(".lecture_cont").hide();$(".lecture_cont").eq(0).show();$(".recom_lecture_menu li a").each(function(i){$(this).bind("click",function(event){$(".recom_lecture_menu li").removeClass("on");$(this).parent().addClass("on");});var num = i;$(this).bind("click",function(){$(".lecture_cont").hide();$(".lecture_cont").eq(num).show();});});return false;}); Html인기/추천강좌.. 이전 1 2 3 4 ··· 6 다음
