이 문서의 예에서는 JavaScript를 사용하여 간단한 팁 상자 효과를 구현하는 방법을 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.
// JavaScript Document document.write("<div id='tip' style='position:absolute; width:300px; z-index:1; background-color: #ffffff; border: 1px solid gray; overflow: visible;visibility: hidden;font-size:12px;padding:12px;color:#333333'></div>") function showtip(w){ var x=event.x; var y=event.y; tip.innerHTML=w; tip.style.visibility="visible"; tip.style.left=x+10; tip.style.pixelTop=y+document.body.scrollTop+10; } function hidetip(){ tip.style.innerHTML="" tip.style.visibility="hidden"; }
위 내용을 다음 이름으로 저장하세요: showtip.js
<table width="100%" border="0" cellspacing="0" cellpadding="0" background="#F7F7F0"> <tr height="25"> <td background="images/line-dot.gif" height="20" align="left"><IMG height="5" src="images/dot2.gif" width="5"> <a onmousemove="showtip('<b>标题:</b><br>毕业女生 自信更在包装外<br>')" onmouseout=hidetip() href='Common/NewsDetails.aspx?id=1035' target=_blank> 毕业女生 自信更在包装外 </a> </td> </tr> <tr> <td background="images/point_h.gif" height="1"></td> </tr> </table>
더 많은 JavaScript 관련 콘텐츠에 관심이 있는 독자는 이 사이트의 특별 주제를 확인할 수 있습니다: "JavaScript 전환 효과 및 기술 요약", "JavaScript 검색 알고리즘 기술 요약", "JavaScript 애니메이션 특수효과 및 기법 요약", "JavaScript 오류 및 디버깅 기술 요약", "JavaScript 데이터 구조 및 알고리즘 기법 요약", "JavaScript 순회 알고리즘 및 기법 요약" 및 "JavaScript 수학적 연산 사용법 요약"
이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.