홈페이지제작/자바스크립트 (10) 썸네일형 리스트형 자바스크립트 배경 bakcground 변경 자바스크립트 bakcground 배경 변경 테이블 셀의 배경을 지정하는 HTML 코드는 background='배경이미지' 의 형태로 지정하면 되는데, 자바스크립트 코드를 이용해서 동적으로 변경하려면 어떻게 해야할까요? 자바스크립트로 테이블의 배경등을 바꿀려면 아래 샘플코드를 참조하시면 이해하실 겁니다. 샘플코드 aaaabbbbcccc 요약배경이미지를 자바스크립트를 이용하여 동적으로 변경하기 객체.backgroundImage = "url('이미지')"; 자바스크립트 브라우저 화면크기 알아내기 브라우저의 화면크기 알아내기 지난번에는 모니터의 크기를 알아내는 방법을 포스팅 한 적이 있습니다. (모니터크기 알아내는 방법 바로가기)이번에 설명드릴 내용은 브라우저의 화면크기를 알아내는 방법입니다. 브라우저 화면크기 브라우저의 크기라 하면 같은 브라우저라도 최대창 모드냐 아니냐에 따라 달라집니다.그리고, 브라우저 윈도우를 사용자가 어떻게 조절하느냐에 따라 크기가 달라집니다. 관련 속성 이때 사용가능한 것이, document.body.clientWidthdocument.body.clientHeight 입니다. clearInterval 함수를 이용한 타이머 사용 자바스크립트 자바스크립트에서 실행중인 타이머의 중단 (clearInterval) clearInterval setInterval 함수로 시작된 타이머의 실행을 중단시킬 때 사용됩니다. 사용예 (1) 에서 시작한 타이머 t 를 (2)에서 중단시키는 예제입니다. 좀더 설명드리자면, 1초마다 mmm 함수가 수행되어집니다. 수행결과로 txt_temp 의 값이 1씩 증가하게 됩니다. txt_temp 의 값이 20에 도달하면 타이머의 실행을 중단시킵니다. 결과로, txt_temp 의 값은 1에서 20까지 증가하다가 20에서 멈추게 됩니다. setInterval 타이머의 사용 자바스크립트 자바스트립트에서 setInterval 함수를 이용한 타이머의 활용 프로그램을 작성할 경우 타이머가 사용되어지는 빈도는 매우 높습니다. setInterval과 유사한 setTimeout 를 이용하여 타이머를 사용하는 내용에 대해 지난번에 포스팅했습니다. (setTimeout 보러가기) 이번 포스팅은 setInterval에 대한 내용입니다. setInterval 함수 사용형식 t = setInterval(mmm, 1000); // 1000 = 1초입니다. function mmm() { 실행할 명령들 ~; } 위 형식으로 사용하면 1초마다 mmm 함수가 호출되어 실행되어집니다. setInterval 함수의 사용예제 위 예제는 아래와 같은 화면이 나타나며, 숫자가 1에서 시작하여 1초에 1씩 계속 증가합니다. .. jQuery 에서 쿠키 사용 jQuery 에서 쿠키 사용 1. 아래 파일을 다운로드하여 계정에 올리세요. 2. 필요한 곳에 아래와 같이 포함(embed) 시키세요 3. 사용쿠키에 저장 : $.cookie('cookie name', 'cookie value');쿠키값 참조 : $.cookie('cookie name');쿠키값 삭제 : $.cookie('cookie name', null); 4. 사용2쿠기에 저장 : $.cookie('cookie name', 'cookie value', {path:'/', expires:10}); // 유효기간을 10일로 지정 자바스크립트 iframe 내용에 따라 크기 자동 조절 자바스크립트 iframe 내용에 따라 크기 자동 조절iframe를 사용해야 할 경우가 간혹 있습니다. 그런데, iframe를 사용하려면 꺼려지는 마음이 먼저 드는데, 그 이유는 스크롤바가 생기기 때문입니다.iframe에 담겨질 내용이 미리 지정된 iframe의 높이를 초과하는 경우가 분명히 발생하기 때문입니다.정해진 내용을 iframe에 담을 일은 없죠. 분명 iframe 안에 담길 내용은 상황에 따라 바뀌는 내용입니다. 상황에 따라 바뀌게 되면 그 높이도 어떻게 될지 모르죠.아래 소스를 참조해보세요. iframe 의 내용이 길어지면 같이 길어질 수 있도록 자동으로 크기롤 조절해주는 소스입니다. 자바스크립트 화면의 크기 알아내기, 사용자 모니터의 해상도를 알아내기 자바스크립트 작성시 사용자 화면(모니터)의 크기(해상도)를 알아내야 할 경우가 있습니다. 특히, 모바일 홈페이지를 작성할 경우, 모바일 디바이스의 화면크기가 매우 다양하기 때문에 모바일 디바이스의 화면 크기를 알아야할 필요가 더 생기지요. 아래 객체 변수를 참조하세요. screen.availWidth : 사용자 화면의 폭 screen.availHeight : 사용자 화면의 높이 웹페이지의 스크롤된 높이를 알 수 있는 변수 document.body.scrollHeight : 내용의 스크롤 된 높이 샘플코드 이미지맵 마우스 오버시 하이라이트 표시 이미지맵에 마우스 오버시 하이라이트 표시 방법설명이미지맵을 이용하여 지도상에 특정 구역을 나누고,마우스오버시 그 구역이 하이라이트되어 표시되는 효과에 관련한 방법입니다. (이미지참조)jQuery, maphilight 스크립트를 링크하고,이미지에 이미지맵을 정의하면 끝입니다.참조사이트 : http://davidlynch.org/projects/maphilight/docs/demo_usa.html참조소스 : 아래 소스는 위 참조사이트의 소스 일부를 발췌한 내용입니다.The United States of AmericaThis map generated from "Map of USA with state names.svg".이미지 맵 정의실행 이미지 이전 1 2 다음 목록 더보기
