웹마스터 팁

<HTML>
 <HEAD><TITLE> 마우스 이벤트(Layer)를 이용한 활용예제 </TITLE>
  <script>
  function View(brdContent)
  {
 // 글내용을 보여줄 레이어 위치 지정
 document.getElementById('content').style.left=event.x+10+document.body.scrollLeft
 document.getElementById('content').style.top=event.y+10+document.body.scrollTop

   //레이어 표시하기
   document.getElementById('content').style.visibility="visible"

  // 레이어 안에 글내용 채우기
    document.getElementById('content').innerText=brdContent
  }

  function hide()
  {
   // 레이어 표시하기
    document.getElementById('content').style.visibility="hidden"
 }

/*
   1. 레이어 객체 만들기
  ① <태그명 id="이름"></태그명>
     ② <태그명 id="이름">   ---- innerText,innerHTML은 사용안됨

   2. 레이어 객체 접근
  ① document.all.레이어 이름
     (document.all은 생략가능)
 
  ② document.all['레이어이름']
     ===>IE에서만 지원(인터넷 익스플로어)
    
  ③ document.layers['레이어이름']
     ===>NE에서만 지원(네스케이프)

     ④ document.getElementById('레이어이름')
  ===>IE,NE모두 지원
-----------------------------------------------------------------------------------------------------------------------------------
   ※ 레이어 속성 활용
 ① 레이어객체.innerText="문자열"
     : 쌍이 존재하는 태그를 사용한 레이어 안에 문자열 삽입
     : <태그명 id="레이어이름">문자열</태그명>
 
 ② 레이어객체.innerHTML="태그문자열"
  : 쌍이 존재하는 태그를 사용한 레이어 안에 태그문자열 삽입
     : <태그명 id="레이어이름">태그가 포함된 문자열</태그명>


*/
  </script>

 </HEAD>

 <BODY>
  <center>
  <div id="content" style="border:1px solid red; font-size:11px; visibility:hidden; background-color='#FFFFCC'" ></div>
  <table width=650 border=1>
   <tr>
  <th>글번호</th>
  <th>글제목</th>
  <th>작성날짜</th>
  <th>작성자</th>
   </tr>

   <tr onmouseover="this.style.backgroundColor='#FFCCCC'" onmouseout="this.style.backgroundColor=''">
   <td align=center>1</td>
   <td style="padding-left:13px;"><A HREF="#" onmouseover="View('30일동안 체계적으로 학습할 수 있다.')"
   onmousemove="View('30일동안 체계적으로 학습할 수 있다.')"onmouseout="hide()">HTML과 자바스크립트 30일 완성</A></td>
   <!-- 셀테두리와 내용사이의 왼쪽간격이 13px; -->
   <td align=center>2007-04-09</td>
   <td align=center>신문섭</td>
   </tr>

   <tr onmouseover="this.style.backgroundColor='#FFCCCC'" onmouseout="this.style.backgroundColor=''">
   <td align=center>2</td>
   <td style="padding-left:13px;"><A HREF="#" onmouseover="View('초보자도 쉽게 따라 할 수 있는 실무예제 중심으로 구성되었다.')" onmousemove="View('초보자도 쉽게 따라 할 수 있는 실무예제 중심으로 구성되었다.')" onmouseout="hide()">Contact ASP3.0</A></td>
   <!-- 셀테두리와 내용사이의 왼쪽간격이 13px; -->
   <td align=center>2007-04-18</td>
   <td align=center>정일섭</td>
   </tr>
 
  </table>
  </center>
 </BODY>
</HTML>


위의 소스는 http://blog.naver.com/PostView.nhn?blogId=sadaudgh&logNo=10019255414 여기서 가져왔어요

제목 글쓴이 날짜
1.5.2.3 업데이트 후 이미지, 아이콘 테두리 생김 현상 없애는 방법 [3] 비밀얌 2012.04.28
1.5.2.3 에서 게시글이 등록이 되는데 ajax XML parser 에러가 나는경우 엑스셀코드 2012.04.28
게시판에 다운로드 횟수 출력하기 (스케치북 게시판 전용) [5] file 숭숭군 2012.04.20
관리자 글 등록시 비번 입력하게 만들기 [5] 우진♡아빠 2010.04.28
Xe 1.5.1로 사이트 꾸미기 part 1 [25] file 황비 2011.12.04
도라란님의 팁에 추가하여 MP3와 동영상 파일도 막고 싶을 경우.. [4] Canto 2011.07.23
이미지 외부링크 차단하는법 [6] 리리슐츠 2012.04.08
회원가입폼 비밀번호 찾기 질문/답변 삭제및 필수항목 선택 (송동우님 팁) 때린데 또때려 2012.04.08
XE 1.5 이상에서 XE 1.4.5.10 이하 버튼 사용하기 [4] [1] file 웹 엔진 2011.12.18
조회수 클릭때마다 올라가기(1.4.5.7 버전에서 되네요) [2] file 아네모네 2011.06.20
마우스 오버시 텍스트 호버링(주석나타내기..레이어적용) [1] Konghee 2012.04.02
[초보팁] 최근게시물 위젯에 확장변수 표시하기 [23] 오뎅궁물 2010.01.29
이번 xe 1.5.2.1 업데이트 하고 게시판 보기 .htaccess 문제 권기성2 2012.03.29
1.5 업데이트후 블로그스킨, 리스트에서 내용출력안되는분 수정방법 [4] Xiso 2011.12.23
제로보드4 에서 xe 1.5 버전설치후 xml 파일 이전시 파일 누락되는 현상해결 [4] 때린데 또때려 2012.03.24
youtube (유튜브) 동영상 block없이 게시판에 embed 하기 [23] 쏘프티 2011.05.10
그룹별 회원정보 검색 & 회원의 추가가입폼 복수 검색 팁 (XE 1.5) sejin7940 2012.03.22
phpmyadmin 로그인시 아래와 같은 에러나올경우 해결방법 [1] file 때린데 또때려 2012.03.12
XE Core 압축파일(tar.gz)을 올려 서버상에서 압축풀기 [2] 뚱뚱이1 2012.03.01
ie9에서 파일첨부버튼이 먹통일때.. (1.4.5.10 버전) 엔키오 2012.03.07