#TyBio라는 #descriptblock이미지 위로 마우스를 가져 가면라는 상자 에 넣으려고합니다 #TyPhoto. 사람들이 이와 비슷한 일을 한 몇 가지 예를 살펴 보았지만 어떤 이유로 마우스를 올려도 텍스트가 표시되지 않습니다. 미리 감사드립니다!
자바 스크립트
$(document).ready(function() {
$("#TyPhoto").hover(function(){
$("#TyBio").show();
},function () {
$("#TyBio").hide();
});
});
CSS
#descriptblock {
z-index:5;
width:1150px;
height:100px;
top:270px;
left:0px;
position:absolute;
background:white;
text-align:left;
display:block;
}
#TyBio{
display:none;
}
HTML
<html>
<head>
<link rel="stylesheet" href="https://googledrive.com/host/0B4nfVqlTfnTzQ0V5NlQydy0xU00" type="text/css" />
</head>
<body>
<div id="navcontainer">
<ul id="navlist">
<li><img id="TyPhoto" src="https://googledrive.com/host/0B4nfVqlTfnTzWDVMRzBEd1RwX2s" width="204" height="272" /></li>
<li><img src="https://googledrive.com/host/0B4nfVqlTfnTzU0pTYWVwRXZ0Tjg" width="208" height="286" /></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
<span id="descriptblock">
<div id="TyBio">TESTTHISBIOTEST!</div>
</span>
</ul>
</div>
</body>
</html>
HTML에는 자바 스크립트 나 그것이 의존하는 jQuery 라이브러리가 포함되어 있지 않습니다.
<script src="jquery.js"></script>
<script src="your.js"></script>
추가하면 작동합니다 .
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다