레이어/롤오버
레이어를 제어하는 예제 소스와 롤오버를 제어하는 소스들입니다.
[1] 브라우져상에서 마우스로 이동하는 슬라이드쇼 레이어 [Preview]
간단한 슬라이드쇼나 광고용으로 좋겠네요.
[2] 레이어를 숨기고 있다가 버튼을 클릭하면 보여줍니다. [Preview]
FAQ 등에 응용해서 사용하면 아주 유용하겠네요.
[3] 서서히 사라지는 공지창 [Preview]
공지창을 누르게되면
서서히 사라지는 공지창 입니다.

예제 보시면 허접한 스킨을 보시게 됩니다.
그건 제가 만든거구요...
그냥 색만 바꾸어서 사용하시던지..
아님 사용자께서 직접 스킨을 하나 만드셔도 됩니다.
[4] 공지창 클릭하면 사라지는 자바 [Preview]
지금 여러 사이트에서 사용하는
클릭하면 사라지는 공지창 입니다.
제가 허접하게 스킨을 만들었습니다.
이대로 사용하시던지
사용자가 집접 스킨을 만들어서 사용하세요.. ^^

<script language="JavaScript">
<!--
// 주석 붙인 사람은?? ^^;;
// E-mail : flyingmagic@hanmail.net

// 이 부분부터는 사용자가 마음대로 건드릴 수 없는 부분이다.
var curObj;
function toggleMultimedia() {

if (textFade.filters(0).status == 2) {
textFa .....
[5] 움직이는 공지창 입니다.. (1) [Preview]
움직이는 공지 창 입니다.
닫기버튼도 있구요..
이동도 됩니다.
물론 제 허접 스킨이구요..
사용은 사용자님 맘대로.. ^^

<script language="JavaScript">
<!--
// 주석 붙인 사람은?? ^^;;
// E-mail : flyingmagic@hanmail.net

// 이 부분부터는 사용자가 마음대로 건드릴 수 없는 부분이다.
var x =0
var y=0
drag = 0
move = 0
window.document.onmousemove = mouseMove
window.document.onmousedown = mouseDown
w .....
[6] 온오버 이벤트에 링크설명을 배경으로 깔아주는 자스 (플래시같은 효과) [Preview]

링크에 온오버 이벤트를 하면

링크에 정의해놓은 설명들이 배경으로 한가득 깔립니다

모양은 이쁘긴 하지만 속도가 느리네요

[7] 링크에 스크롤되는 레이어 설명 띄우기 [Preview]
링크에 레이어 설명을 띄웁니다

레이어 안에서 설명이 스크롤됩니다
[8] 감추기,보이기 기능에 스크롤까지 되는 레이어 공지창 [Preview]

내용감추기, 보이기 기능은 기본에

스크롤까지 가능해서 이리저리 옮길수 있는 레이어를 사용한 공지창입니다

[9] on/off 기능이 있고 레이어를 마우스로 드래그 할 수 있는 예제 [Preview]
공지용 레이어로 사용할 수 있는 예제입니다.
[10] 레이어를 일정한 시간마다 일정한 위치로 옮기는 예제입니다. [Preview]
익스 6.0, 4.5-5.5 등에서 그리고 넷스에서도 동작하는 레이어를 이동시키는 예제입니다.
[11] on/off기능이 있는 스크롤을 따라다니는 레이어 입니다.. [Preview]
on/off기능이 있는 스크롤을 따라다니는 소스 입니다..

이 소스에는 또 쿠키가 있어서 체크된 항목을 기억하고 있습니다..
[12] 가운데 뜨는 레이어 소스 입니다.. [Preview]
레이어가 항상 가운데 뜨는 소스 입니다..

레이어는 1개밖에 띄우질 못하며
여러개 띄우실려면 소스 전체를 복사하셔서 각 레이어의 정보를 바꾸셔야 합니다..

[13] 테이블의 배경색 또는 배경 이미지를 바꾸는 방법 [Preview]
배경 이미지를 마우스오버시 롤오버의 형태로 바꾸는 예제소스입니다.
많이 응용하시기 바랍니다.
[14] 책갈피 레이어 변경 소스 [Preview]
책갈피 레이어를 페이지 변경없이 바꿔주는 소스 입니다..
[15] 여러개의 레이어를 만들수 있는 소스 [Preview]
자스 소스의 수정 없이 id변경만으로 여러개의 레이어를
만들수 있는 소스 입니다..

각 id부분에 이름만 다르게하면 100개래도 만들 수 있으며
각 id명은 레이어를 열고 닫는 소스에 적어주면 열고 닫기가 가능합니다..
[16] 레이어를 이용해서 셀렉트를 숨기거나 보여주는 기능입니다. [Preview]
레이어를 이용한 메뉴를 사용하는 경우
select 택은 항상 메뉴위에 나오게 됩니다.
이유인즉 z-index값이 어떤 레이어 보다 상위라서 그러는 거죠.

이걸 또 다른 레이어를 이용해서 해결하는 방법입니다.

원리는 셀렉트박스를 레이어 안에 넣어버리면
원하는 순간에 숨기는게 가능하기 때문에 메뉴와 중복된다면 메뉴가 활성화 되는 시점에
원하는 레이어(셀렉트박스가 있는 레이어)를 숨겨 버리면 됩니다.

메뉴와 같이 사용하는건은 응용하시면 별 무리가 없을듯합니다.
[17] 레이어를 이용해 자유자재로 이동되는 이미지 [Preview]
레이어를 이용해서 이미지가 자유자재로 이동되는 소스입니다..
[18] 왼쪽에서 오른쪽으로, 오른쪽에서 왼쪽으로 레이어가 움직이는 예제 소스 [Preview]
링크를 누르면 왼쪽으로 또는 오른쪽으로 레이어가 이동하는 예제입니다.
물론 화면(브라우져)의 경계를 벗어나지 않고 멈춥니다.
[19] 테이블에 마우스를 가져가면 다른색으로 페이드 되었다가 다시 흰색으로 [Preview]

기존 테이블 페이드와는 달리 흰색의 테이블에 마우스를 가져가면

각각의 색깔들로 페이드 되었다가 다시 곧장 흰색으로 페이드 되어 돌아오는 스크립트 입니다
[20] 테이블에 마우스를 가져가면 페이드 효과나는 자스 [Preview]
페이드 효과가 납니다.

<SCRIPT language=JavaScript>
<!--
/////////////////////////////////////////////
// :*: Happyscript :*: //
// 소스 : http://www.happyscript.net //
// 편집 and 소스 설명 : Magic //
// E-mail : flyingmagic@hanmail.net //
/////////////////////////////////////////////

// 이 부분부터는 사용자가 마 .....
    [1] [2] [3]    
Javascript Source List :