Cufon에서 hover 사용하기

Cufon은 font를 js 데이터로 변환해 canvas로 출력하는 방식으로, 기존 iFR, FIR, sFIR 처럼 텍스트를 그래픽 폰트로 변경해주는 도구다. canvas 기반이라 플래시보다 무겁진 않지만 글꼴의 끝부분이 다소 뭉개지는 현상이 있다. 한국어 폰트는 여전히 글자수가 많기 때문에 용량상 이득은 크게 없는 편이다.

Cufon에서 :hover를 사용하기 위해서는 다음과 같은 방법으로 작성해야 한다.

Cufon.replace('#navlist li a', { hover: true, fontFamily: 'MyFont' });
Cufon.replace('h2, h3, h4', { hover: true,  fontFamily: 'MyOtherFont'});

다음과 같이 작성하면 내용이 덮어져 :hover가 동작하지 않는다는 점을 유의하자.

Cufon.replace('#navlist li a', {hover: true});
Cufon.replace('#navlist li a', {fontFamily: 'MyFont'});
김용균

안녕하세요, 김용균입니다. 문제를 해결하기 위해 작고 단단한 코드를 작성하는 일을 합니다. 웹의 자유로운 접근성을 좋아합니다. 프로그래밍 언어, 소프트웨어 아키텍처, 커뮤니티에 관심이 많습니다.

이 글 공유하기

이 글이 유익했다면 주변에도 알려주세요!

페이스북으로 공유하기트위터로 공유하기링크드인으로 공유하기Email 보내기

주제별 목록

같은 주제의 다른 글을 읽어보고 싶다면 아래 링크를 확인하세요.

November 03, 2011

mysql 5.5.x 캐릭터셋 변경하기

이번에 mysql 최신 버전을 써보겠다는 일념으로 mysql 5.5.x 소스를 받아 컴파일해서 서버에 올렸습니다. 이상하게 한글이 깨져 보니 기본 캐릭터셋이 latin1로 되어 있어서 변경해보고자 검색을 해봤지만 적용하니 mysql이 시동조차 되지 …

October 22, 2011

centOS에서 tomcat 서버 설치하기

java 소스도 겨우 읽는데 tomcat 서버 설치하느라 고생했습니다. 상당히 단순한 절차인데도 개발자분이 올린 소스가 계속 에러가 나서 설치 문제인줄 알고 몇번이고 다시 설치를 시도했는데 다행히도(?) 폴더명이 문제였습니다. 지웠다가 재설치 하는 …