close_btn
로그인, 회원가입후 더 많은 혜택을 누리세요 로그인 회원가입 닫기




♡두장의 이미지를 한공간에 동침시키기♡


이미지클릭 정지/재생


동낚인 가족님들 안녕하세요. 백면서생입니다. 잠못드는 겨울밤에 좋아하는 음악부터 한곡 찾아내서 들어봅니다.
영화"접속"을 통해서 귀에 익숙한 Sarah Vaughan의 "A lover's concerto" 입니다.
혹시라도 소음공해라고 여겨지시는 분들께선,열나게 동낚질중인 위의 백면서생(?) 이미지의 등짝을 사정없이 마우스로 찔러서 음악을 꺼주시면 됩니다.

얼마전에 요청도 있고해서 이번강좌는 "이미지에 눈을 내리게하거나 낙엽이 떨어지게하는 스위시효과"를 넣어주는 강좌를 마련하려 하였습니다만, 스위시효과의 주소들을 확보하는데 생각보다 많은 시간이 걸려서 "스위시효과 강좌"는 차후로 미뤄야 할것 같습니다.
차분히 자료가 준비되는대로 여러분들께 공개해드릴 것을 약속드리면서 오늘은 이미지에 마우스를 갛다대면 다른이미지로 변환되는 "마우스 롤오브"의 강좌를 만들어 봅니다.

낚시를 다녀와서 조행기를 적으려할때 여러장의 찍어온 사진들중에서 아래와 같은 두장의 이미지를 조행기에 사용하려 할 경우,사진을 업로드한 다음 수직으로 배열하고 글을 적어 나가는 것이 일반적인 방법일 것입니다.
하지만 평범한걸 싫어하거나 무엇이든 한공간에 위치시키는걸 좋아하시는 분이시라면 태그를 이용해서 아래 두장의 이미지를 한장으로 포개주면서 사진에 "마우스를 가져갔을때 다른한장의 사진을 보여주게 만들수" 있습니다.
보여주어야 할 사진이 아주 많은 특별한 경우를 제외하고 간단한 근처 동네 방파제 조황을 올리실때 한번쯤 써먹으면 좋을것 같습니다.

예를 들기위해 아래의 두장의 사진이미지를 준비했습니다.

우선 위에 준비한 "방파제 사진"과 "뽈락조황사진" 처럼 가로 세로가 똑 같은 크기의  사진이미지 두장을 준비하고 아래의 빨간색 소스에 "이미지 주소"를 기입해 보겠습니다.

(DIV align=center)
(IMG src="1번주소" OnmouseOver="this.src='2번주소'" OnmouseOut="this.src='1번주소'")

이미지에 마우스를 갛다대 보십시요. 아주 단순한  "마우스 롤오브"효과가 나타나게 됩니다.
위의 빨간색 태그소스에 사진이미지 주소 두개를 기재해주고 얻은 결과입니다.

이번엔 좀 더 세련되게 변화하는 소스를 사용해 보겠습니다.

(DIV align=center)
(IMG src=1번주소 style="FILTER: progid:DXImageTransform.Microsoft.Fade()"
OnmouseOver="this.filters[0].apply(); this.src='2번주소'; this.filters[0].play();"  OnmouseOut="this.filters[0].apply(); this.src='1번주소'; this.filters[0].play();"
)

위의 두번째 빨간색 소스를 이용해서 완성된 "마우스 롤오브효과"입니다.
마우스를 이미지에 올려보십시요. 이미지에 복잡한 변화가 생겨나는게 보이시죠?

별로 복잡하지 않아서 조금만 관심을 가진다면 바로 조행기에 쓰먹을수 있는 간단한 태그소스입니다. 관심이 있으신 분들은 "호래래기조황"이나 "볼락조황"등을 올리실때 요긴하게 적용해보시길 권해드립니다.

위의 빨간색 소스를 복사해서 사용하실땐 파란색으로 표시한 ( ) 를 < >로 바꿔주셔야 합니다.

그리고 위의 소스가 익숙해 지게되면 조금은 색다른방법으로도 응용을 해볼수 있겠습니다.
아래에 보너스로 준비한  응용작은 미성년자 절대관람불가 입니다. 만 20세이하의 회원님들께서는 아래 이미지에 마우스를 갛다대는 일이 없기를 당부드립니다.

20세이상 회원님들만 이미지 위에 마우스를 가져가 보십시요.

태그를 이용해서  이미지에 변화를 주고싶은 회원님들께 작은도움이라도 되었길 바라면서 "마우스를 이용한 이미지의 변화" "마우스 롤오브"의 강좌를 마칠까 합니다.

♡태그에 관심있으신 회원님들께 백면서생이 드리는 당부의 말씀입니다.♡

어쩌다 몇몇 관심있는 회원님의 요청과 저의 호기심으로 시작한 "조행기태그강좌"가 오늘로 여섯번째인 것 같습니다.
죽 한번 읽어 보시기엔 그냥 간단해 보이는 강좌이지만 막상 시작을 해보니 많은 시간과 엄청난 잔머리를 투자해야만 이런 강좌 하나를 만들수 있네요. 물론 저의 능력이 일천한 탓입니다.
강좌를 만들면서 과연 몇분의 회원님들께서 보아주실지 다소 회의감이 들때도 있습니다만,모르는것을 배우고 싶어어하는 단 한사람의 회원님이라도 읽어주시고 도움이 되신다면 더 바랄것 이 없겠다는 생각으로 시작한 조행기태그 강좌였습니다.

그런데 최근들어 이강좌를 계속 만들어가야 하는지에 대해 심각한 고민에 빠졌습니다.
아직까진 태그를 응용해서 게시물을 만들고 싶어하시는 회원님들이 소수인지라 별다른 문제는 없었던 것으로 알고 있습니다. 하지만 점점 많은 회원들께서 태그대열에 동참할 경우 심각한 문제가 될수도 있다는 생각이 들었습니다.

많은 분들께서 초보적인 태그소스를 동낚인 홈피를 이용해서 연습을 하게 될 경우 그분야에 관심없는 대부분의 회원님들과 운영자이신 개굴아빠님에게 심각한 민폐를 끼치게 됨은 물론이고 무분별한 태그소스의 남용은 자칫 동낚인 홈피에 테러를 가하게 되는 위험한 상황을 본의 아니게 초래할수도 있습니다.
이런 위험성 때문에 다음이나 네이버와 같은 포털사이트에서도 허용하지 않는 태그소스가 엄청나게 많습니다.

하여, 태그를 공부하시려는 동낚인 회원 선후배님들께 정중하게 부탁 말씀을 드려봅니다.
우선 태그까페 등을 통해서 최소한의 기본적인 이론공부를 하신 다음,각 포털사이트의 개인블로그를 이용해서 충분히 연습하시고 완성된 소스들 중에서 꼭 올리고 싶은 것들만 엄선해서 게시해 주시기를 당부 드려봅니다.
우리가 아끼고 사랑하는 동낚인 홈피는 "잘 쓰고 후손에게 물려주어야할 소중한 유산입니다."
지금까지 동낚인은 크고 작은 문제가 있을때마다 스스로의 자정작용이 그 어떤 사이트보다 잘 이루어져 왔던 곳입니다.
위에 언급드린 문제에 대해서 지혜로운신 우리 동낚인 회원님들께서 현명하게 잘 대처해 주시리라 굳게 믿어보면서....
저 백면서생은 이만 물러가옵니다. 대단히 감사합니다.



백면서생

번호 제목 글쓴이 조회 수 추천 수 날짜
공지 원전 해상 콘도 연락처 [9] 개굴아빠 302 0 2021.09.07
공지 제품 소개(판매 대행) 관련 협조 요청 [27] 개굴아빠 685 0 2012.11.26
공지 [경축] 동낚인 회원 욕지도 운임 약 50% 할인 [267] 개굴아빠 6415 8 2009.11.13
공지 [안내] 사용 약관 및 개인 정보 보호에 관한 안내 [19] 개굴아빠 497 1 2009.08.26
공지 [안내] 회원 등급 관련 [263] 개굴아빠 2342 7 2009.08.26
공지 동낚인은...... [151] 개굴아빠 8794 106 2005.10.15
3690 공구 물품 창원 지역... [7] 능글 291 0 2007.09.22
3689 생신축하합니다.... [54] 능글 291 0 2007.07.18
3688 전국 상세 물때표 仁山 291 5 2007.04.11
3687 동낚인 로고 [23] file 능글 291 1 2007.03.06
3686 뒤풀이~~~~ [14] 조테리 291 2 2006.07.12
3685 이런...일이 [7] file 어복쟁이 291 1 2006.07.10
3684 요즘 실리 콘도 밤에는 뭐가 나오나요? [2] 돌짱게 291 2 2006.04.18
3683 & 164킬로그람의 초대형 우럭 발견♣♣ [9] file 금바늘 291 5 2006.04.04
3682 벙개 모임 후기... [11] 행복 291 6 2005.10.06
3681 문의드립니다 (원전 땟마) [4] 삼계감시 290 0 2016.03.08
3680 거제에는 이런넘도 잡히내요 [19] file 호렉 290 1 2016.03.08
3679 낚시 대신... [57] file 찬나파 290 0 2014.01.12
3678 에기 공구 접수 시작 [22] 개굴아빠 290 0 2012.07.06
3677 6월 23일 번개 후기 [71] file 쥴리아 290 0 2012.06.25
3676 올한해 동안 즐거워던 날들과 아쉬운날들 [34] file 감생이모친 290 0 2009.11.14
3675 비오는날 ..추가사진 [11] file 소년의나무 290 9 2007.05.02
3674 도 다 리 낚 시 대 회 ....... 나의 생각 [8] file 버섯돌이 290 0 2007.03.12
3673 영원하리 ~ 동낚인 [16] file 유림 290 1 2007.03.12
» ☆ 두장의 이미지 한공간에 동침시키기☆ [17] 백면서생 290 3 2007.01.10
3671 창원 시청 로타리 [8] file 능글 290 0 2006.12.26