호빵홈 소스자료실
현재위치 : hobbang.co.kr > 소스자료실
소스자료실은 홈페이지를 만들거나 꾸밀 수 있는 자바스크립트와 HTML 소스를 제공합니다.
또한 컴퓨터와 인터넷을 사용하면서 유용한 Tip도 제공하니 각 Category를 선택하세요.

Category

  (Homepage)님의 글입니다.
마우스 가져가면 흐려지고 마우스 밖으로 가면 밝아지는 그림 2003-05-28 23:30:15, 조회 : 2,692, 추천 : 12

설명을 이해하지 않고 그대로 복사해 가는 경우라면 설명의 출처를 http://hobbang.co.kr 이라고 표기해주시구요.. 자신이 이해하고 이 설명을 참고해서 자신의 홈에 올리는 경우라면 출처 안밝혀도 상관 없습니다.. ^^


▶ 예제 보기




실행화면에서 그림에 마우스를 올리고 내리고 해보세요.. 그림들이 밝아졌다 흐려졌다 할 것입니다요..


▶ HTML 태그 소스 보기

아래 검은색 버튼을 누르면 내용이 복사되니 사용할 HTML 문서를 웹에디터나 메모장 또는 워드패드에서 열어서 원하는 위치에 붙여넣기 해서 사용하세요..



아래 박스 안의 내용이 HTML 태그 소스입니다..

<img src="그림주소" border="0" style="filter:alpha(opacity=30)" onmouseover="this.filters.alpha.opacity='100'" onmouseout="this.filters.alpha.opacity='30'">




▶ HTML 태그 소스 설명

  • src="그림주소" : 그림주소 지정하면 됩니다..

  • border="0" : 링크된 그림은 테두리(border)를 0으로 지정해주지 않으면 그림에 테두리가 생겨버립니다.. 그러니 테두리 없음으로 0을 지정한 것입니다..

  • style="filter:alpha(opacity=30)" : 그림을 처음 불러왔을 때 적용되는 필터입니다.. alpha() 필터라는 것을 적용한 것인데 소스자료실1에서 필터라고 검색하면 전체 필터에 대한 설명 나옵니다.. opacity는 투명도를 지정하는 것인데 0은 완전 투명, 100은 필터를 적용하지 않았을 때와 같은 불투명 상태입니다.. 숫자가 작아지면 점점 흐려지는 것입니다..

  • onmouseover="this.filters.alpha.opacity='100'" : 마우스를 해당 그림 위에 올렸을 때(OnMouseOver) 실행되는 사건을 지정하는 것으로 여기에서는 이 태그(여기에서는 그림 태그입니다)의 필터(filters) 중 알파(alpha) 필터의 투명도를 조절합니다.. 역시 숫자는 0 ~ 100 까지의 숫자 중 하나를 써주면 됩니다..

  • onmouseout="this.style.color='바뀔색2'" : 마우스를 해당 그림 위에서 밖으로 이동했을 때(OnMouseOut) 실행되는 사건을 지정하는 것으로 여기에서는 이 태그(여기에서는 그림 태그입니다)의 필터(filters) 중 알파(alpha) 필터의 투명도를 조절합니다.. 역시 숫자는 0 ~ 100 까지의 숫자 중 하나를 써주면 됩니다..


  • 특별히 자바스크립트 같은 것은 사용하지 않아도 되니 태그를 복사해서 사용하고 싶은 만큼 사용하세요.. ^^


    2022-06-27
    17:58:06


      추천하기   목록보기

    현재글을 이메일로 보내기

    No 제 목 글쓴이 작성일 조회
    628   핸폰 문자메시지 붙여쓰면 통화요금 줄어     12-11 18:01 2756
    627   [플래시 동영상] 포토샵 기본 기능 설명     10-29 12:51 2747
    626   리얼플레이어 파일(ra, rm)을 배경음악으로 듣기     05-24 18:42 2741
    625   [펌] META(메타) 태그     05-15 00:41 2738
    624   왕초보들의 보안 10계명 - 퍼옴     05-25 23:30 2736
    623   파일 확장자 설명     09-14 10:03 2733
    622   문서 안에서 다른 문서를 불러오는 IFRAME 태그     05-24 16:44 2732
    621   IE의 [파일] - [다른 이름으로 저장] 버튼 만들기     11-21 06:46 2717
    620   글씨에 마우스를 가져가면 글씨의 배경색이 바뀌는 소스     05-31 21:36 2716
    619   비가 내려오는 소스 - 17     09-08 04:56 2696
      마우스 가져가면 흐려지고 마우스 밖으로 가면 밝아지는 그림     05-28 23:30 2692
    617   마우스를 올리면 버튼의 배경색이 바뀌는 소스     05-31 21:19 2689
    616   [포토샵] 액션의 spatter 효과로 테두리 만들기     09-26 02:13 2665
    615   기념일 계산 자바스크립트(지난날 남은날 모두 계산 가능)     05-28 21:41 2645
    614   3종류의 호빵이 내려오는 소스     05-24 13:56 2626
       [1][2][3][4][5][6][7][8][9] 10 ..[51] [다음 10개]
     
    Copyright 1999-2022 Zeroboard / skin by Praise Jesus
    Copyright ⓒ 1998~ . Hobbang.co.kr. All rights reserved.