这是我的show div.html的html和脚本代码,不适用于谷歌浏览器,但在Firefox和ie8中工作正常,我现在该怎么办?请检查我分享的代码。隐藏();节目();功能无法正常工作。
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-1.9.1.min.js"></script>
<style>
.tab-container /* this is the css code for the tabs*/
{
float:left;
width:30%;
//border:1px solid #147D36;
//border-left:4px solid #147D36;
margin-left:1.5%;
margin-right:1.5%;
}
.tab-text /* this is the div for the text that is coming on hover*/
{
width:97%;
margin-left:3%;
float:left;
background:#fff;
opacity:0.5;
color:#1B6298;
margin-top:-65px;
z-index:999999;
/*display:none;*/
}
.tab-title/* this is the div for the text title that is coming on hover*/
{
float:left;
width:100%;
font-weight:bold;
font-size:18px;
padding-top:17px;
}
.tab-content/* this is the div for the text content that is coming on hover*/
{
float:left;
width:30%;
float:right;
font-size:12px;
padding-bottom:10px;
}
</style>
<!--this is my html code-->
<div class="tab-container">
<img src="images/ourmission.png" width="100%">
<div class="tab-text">
<div class="tab-title">Our Mission</div>
<div class="tab-content">read more</div>
</div>
</div>
<div class="tab-container">
<img src="images/ourfinincial.png" width="100%">
<div class="tab-text">
<div class="tab-title">Our Financial</div>
<div class="tab-content">read more</div>
</div>
</div>
<div class="tab-container">
<img src="images/ourgoals.png" width="100%">
<div class="tab-text">
<div class="tab-title">Our Team</div>
<div class="tab-content">read more</div>
</div>
</div>
<script>
/*jquery code for the show and hide function on hover-scripting code */
$(document).ready(function() {
$('.tab-text').hide();
$('.tab-container').hover(function() {
$(this).find('.tab-text').show();
}, function() {
$('.tab-text').hide();
});
});
</script>
最佳答案
您的代码几乎可以正常使用:http://jsfiddle.net/Rq46A/1/
尝试:
$(document).ready(function() {
$('.tab-text').hide();
$('.tab-container').hover(function() {
$('.tab-text').show();
}, function() {
$('.tab-text').hide();
});
});
您不需要2个
$(document).ready();
代替
$(this).find...
使用$('.tab-text')