[카테고리:] 웹 개발

JavaScript: 전역 변수와 지역 변수 명칭이 같을 경우의 위험성

JavaScript에서 전역 변수와 지역 변수의 명칭이 동일할 경우 예기치 못한 지점에서 undefined로 취급되는 문제가 발생할 수 있다. 간단한 소스 코드로 예를 들어 본다. 첫 번째 console.log(test)를 실행해 보면 콘솔에 당연히 'a'가 뜬다. func() 함수 안에서 console.log(test)를 찍어도 마찬가지로 test가 이미 선언된 전역 변수로 인식되어 마찬가지로 콘솔에 'a'가 뜬다. 하지만...

Swiper.js 오류: [Intervention] Ignored attempt to cancel a touchmove event…

[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted. 스와이프(swipe) 기능을 모바일용 웹페이지나 하이브리드 모바일 앱에 구현하기 위해 Swiper.js를 쓰는 경우가 있는데, 간혹 웹브라우저의 콘솔에 위와 같은 에러 메시지가 나면서 오동작하는 경우가 있다. 간단한 해결 방법은 HTML...

CSS에서 특정 문자만 다른 글꼴을 사용하게 하는 방법

아래 예제는 기본 폰트는 굴림으로 하되, 일부 문자(〈〉《》「」『』【】〔〕〖〗〘〙〚〛, 유니코드로 U+3008-3011, U+3014-301B, U+301D-301F)만 맑은 고딕으로 처리되게 하는 예이다. <!DOCTYPE HTML> <html> <head> <title>테스트</title> <style> @font-face { /* Special이라는 이름의 임시 폰트를 정의 */ font-family: 'Special'; /* 컴퓨터에 설치돼 있는(local) 맑은 고딕(Malgun Gothic) 폰트를 사용 */ src: local('Malgun Gothic'); /* 유니코드의...

HTML에서 언어 속성을 지정하기, CSS에서 언어별 폰트를 지정하기

HTML에서 특정 텍스트가 어떤 언어로 작성됐는지 지정하는 lang 속성이 있다. 이 속성을 지정해 주면 장점이 몇 가지 있는데, 1. 장애인을 위한 TTS(Text-to-Speech) 기능이 언어에 맞게 읽힐 수 있고, 2. 필요에 따라 CSS를 통해 언어별로 글꼴을 다르게 지정하는 것도 가능하다. 언어별로 글꼴을 다르게 지정하는 것은 동아시아 언어(CJK)에 특히 유용하다. 아래...