angularjs에서 이미지 crop의 ngImgCropFullExtended에서 아래와 같은 에러가 발생한다면...ColorThief is not defined이때 해결방법으로 아래처럼 require를 선언한 부분에 코드를 수정합니다.imgCrop = require('ng-img-crop-full-extended'); // 변경 전// 아래와 같이 변경imgCrop = require('imports?this=>window,exports=>false,define=>false!ng-img-crop-full-extended'); &n...
자바스크립트를 사용하여 만약 특정한 영역 및 엘리먼트의 위치로 스크롤을 위치하려면 어떻게 해야할까요? 예를들어 회원가입을 원할 경우 입력폼이 보이는 곳으로 스크롤을 위치하는 방법이 필요합니다. 이때 가능한 방법은 아래처럼 세 가지를 생각해볼 수 있습니다.i. #id를 a 태그 링크로 사용(Anchor 사용방법)ii. focus() 이벤트를 사용하는 방법은iii. scrollIntoView() 메소드를 사용하는 방법은# 자바스크립트 원하는 위치로 스크롤 이동하는 방법만약 아래와 같은 input 태그가 존재하는 경우를 예로 들어보겠습니다.<input type="te...
웹퍼블리셔를 구인, 구직하는 과정에서 필요한 스킬과 스펙은 어떤 것들이 있을지 알아보고자 합니다.먼저 간단하게 웹퍼블리셔가 하는 일을 알아보면 퍼블리셔(Web publisher)는 웹사이트의 앞단, Front 영역을 맞아 개발하는 직군으로 UI개발자라고도 불립니다. 코더 및 개발자와는 다르게 분류되는데 일반적으로 개발자라고 단순하게 부르면 Back단, 서버 쪽 개발직군을 의미하지만 퍼블리셔는 사용자에게 가장 근접한 앞단을 개발하게됩니다.이런 이유로 사용자 인터페이스, 기획 및 시나리오, 웹디자인과 친숙한 경우 상대적으로 이점이 많아 웹기획자 또는 웹디자이너에서 퍼블리...
웹사이트에는 다양한 정보를 한께번에 전달하기 위해 수 많은 입력폼이 존재할 수 있다. 예를 들어 회원가입 페이지만 하더라도 개인정보 및 동의 등등 입력해야하는 필드 수만 상당하다. 이런 경우 만약 이 폼들을 그룹화한다면 더욱 편리하게 관리할 수 있을 것이다. 이에 html에는 fieldset이라는 태그가 존재하며 이 태그를 사용할 경우 다수의 입력폼들을 그룹화하여 관리 및 콘트롤할 수 있다. 그럼 아래에서 좀 더 자세한 내용을 확인해보자.! fieldset 태그 알아보기fieldset 태그는 아래와 같은 몇 개의 속성들을 지정하여 사용할 수 있으며 각각의 속성들의 특...
웹에서 데이터를 저장하는 방법 중 서버가 아닌 클라이언트에서 가능한 방법을 알아보려고 합니다.웹사이트의 정보를 저장하기 위해서 반드시 서버가 필요한 것은 아닙니다. 사용 목적에 따라 클라이언트 저장소 역시 좋은 역할을 할 수 있습니다. 일반적으로 클라이언트 저장소를 생각하면 가장 먼저 쿠기 저장소를 떠올리겠지만 html5에는 좀 더 효과적인 클라이언트 저장 공간을 제공하는데 어떤 것이 있는지 알아보면 다음과 같죠.! localStorage, sessionStorage API 알아보기html5에서는 좀 더 쉽고 간단한...
자바스크립트를 사용해 팝업창을 띄우는 방법은 그다지 어렵지 않습니다. window 객체의 open() 메소드를 사용하여 원하는 팝업을 한개 또는 다수 띄울 수 있죠. 하지만 만약 오늘 하루... 24시간 동안 팝업을 띄우지 않을 경우에는 어떻게 해야할까요? 아래는 24시간 동안 팝업을 띄우지 않는 방법에 대하여 알아보고 이를 사용한 예제소스를 함께 확인해보도록 하겠습니다.# 24시간동안만 띄우는 팝업창 구현하기먼저 팝업창을 구현할 경우 팝업창을 '닫기' 또는 '하루만 열기' 등의 다음과 같은 버튼들이 존재합니다. 일반적으로 아래 세가지 버튼이 가장 많이 사용되고있죠....
embed 태그를 사용하여 유투브(Youtube) 영상을 콘텐츠에 삽입하는 경우 IE 8 에서 정상적으로 동작하지 않을 수 있다. 이 경우 어떻게 해야 정상적으로 IE 8 구버전에서 플레이가 가능한지 알아보고자 한다.먼저 embed 태그가 IE 8 에서 지원하지 않는 것 같다... 이를 해결하기 위해 아래와 같이 해당 태그를 다른 태그로 변경하면서 테스트를 실시하였다. 실시 환경은 Windows 7 IE 8 브라우저이다.1. object 태그2. video 태그3. iframe 태그위와 같이 세 가지 태그를 모두 사용하여 IE 8 에서 테스트한 결과는 다음과...
IE 구버전(IE 8 이하) 에서는 label 태그가 정상적으로 동작하지 않는다. 그렇기 때문에 라디오 또는 체크박스등에 사용된 input 태그가 정상적으로 동작하지 않는데 이를 수정하기 위해서는 아래와 같은 스크립트를 추가해야한다.아래는 jQuery 제이쿼리를 사용한 방법으로 아래 코드를 IE 구버전에서 추가시키도록 한다.// For support IE 8, label tag$(function() { $("label").on('click', function(){ if ($(this).attr("for") !=...
몇일 전... 예전에 꼭 보고 싶었던 영화를 다시 볼 수 있는 기회가 생겼습니다. 바로 메트릭스(Matrix)입니다 !!영화 메트릭스는 키아누 리브스가 나오는 대표적인 영화라고 할 수 있습니다. 1편의 흥행과 함께 2편 그리고 3편까지 속편이 나왔으며 성공적인 흥행을 이루었습니다. 이 영화에 대하여 잠시 얘기해볼까요?! 메트릭스... 미래에 현실이 될 지 모르는 기계가 인류를 지배하는 세상!영화 메트릭스는 미래의 시점을 얘기합니다. 미래에는 어떤 세상의 모습일지 누구나 궁금해합니다. 메트릭스는 컴퓨터의 발달과 인공지능이 놀라울 정도로 발달한 기계로부터 지배를 받는 인...
우리는 쿠키에 대하여 잘 알고있다. 일반적으로 쿠키(cookie)라 함은 저장소의 한 형태로 필요한 몇가지 정보들을 정해진 유효기간까지 사용할 수 있도록 해주는 아주 편리한 기능이다. 이 쿠키에 대하여 혼동되는 부분이 하나 있는데 바로 서버측이나 아니면 클라이언트측이냐 하는 것이다...이런 문제는 서버측 언어와 클라이언트 언어 둘 다 쿠키 사용과 관련된 API를 가지고 있기 때문이다. 그렇기 때문에 우리는 쿠키선언을 어디에서 해야할 지 혼동할 수 있다. 게다가 둘 다 해야하는지 아니면 한 쪽만 해야하는지 혼동할 수 있는 부분이 충분하다.!! 쿠키는 클라이언트에 저장된...