Javascript 元素'；不会褪色，但会褪色

正如标题所说，我有一个元素，不应该消失，但正在消失。所讨论的元素是图像上方的文本，当您将鼠标移到图像上方时，该文本会淡出

HTML:

---

小提琴：

淡入

img

而不是

。淡入
元素


$（文档）.ready（函数（）{
$（'.fade'）.mouseenter（函数（ev）{
$（this）.find（'img'）.fadeTo（150,0.5）.sides（）.fadeIn（150）；
}).mouseleave（函数（）{
$（this）.find（'img'）.fadeTo（150，1）.sides（）.fadeOut（150）；
});
});
ul{
列表样式类型：无；
}
.生物{
填充：15px；
}
.生物头{
利润上限：-150px；
}
.瓷砖{
宽度：158px；
高度：210px；
边框：1px纯黑；
}



标题
信息



淡入
img
而不是
。淡入
元素


$（文档）.ready（函数（）{
$（'.fade'）.mouseenter（函数（ev）{
$（this）.find（'img'）.fadeTo（150,0.5）.sides（）.fadeIn（150）；
}).mouseleave（函数（）{
$（this）.find（'img'）.fadeTo（150，1）.sides（）.fadeOut（150）；
});
});
ul{
列表样式类型：无；
}
.生物{
填充：15px；
}
.生物头{
利润上限：-150px；
}
.瓷砖{
宽度：158px；
高度：210px；
边框：1px纯黑；
}



标题
信息



建议：

HTML

<div id="image-wrapper" >
    <ul id="team-members">
        <li class="tile-wrapper fade">
            <div class="tile">
                <div class="doFade">&nbsp;</div>
                <div class="info">
                    <h3 class="bio bio-header">Header</h3>
                    <p class="bio bio-footer">Information</p>
                </div>
                <img src="http://placehold.it/158x210"/>
            </div>
        </li>
    </ul>
</div>

jQuery

$(document).ready(function() {
    $('.fade').mouseenter(function(ev) {
        $('.doFade', this).add( $('.info', this) ).fadeIn(150);
    }).mouseleave(function() {
        $('.doFade', this).add( $('.info', this) ).fadeOut(150);
    });
});

建议：

HTML

<div id="image-wrapper" >
    <ul id="team-members">
        <li class="tile-wrapper fade">
            <div class="tile">
                <div class="doFade">&nbsp;</div>
                <div class="info">
                    <h3 class="bio bio-header">Header</h3>
                    <p class="bio bio-footer">Information</p>
                </div>
                <img src="http://placehold.it/158x210"/>
            </div>
        </li>
    </ul>
</div>

jQuery

$(document).ready(function() {
    $('.fade').mouseenter(function(ev) {
        $('.doFade', this).add( $('.info', this) ).fadeIn(150);
    }).mouseleave(function() {
        $('.doFade', this).add( $('.info', this) ).fadeOut(150);
    });
});

图像未褪色，
$（此）.fadeTo（150，0.5）行淡入淡出整个
.fade
，您认为图像正在淡入淡出。只需注释行并检查。@thecodeparadox您建议我如何修复它？图像不会褪色，
$（此）.fadeTo（150，0.5）行淡入淡出整个
.fade
，您认为图像正在淡入淡出。只需对行进行注释并检查。@thecodeparadox您建议我如何修复它？当我运行演示时，文本仍处于淡入淡出状态当我运行演示时，文本仍处于淡入淡出状态，当我运行演示时，文本仍处于淡入淡出状态
$(document).ready(function() {
    $('.fade').mouseenter(function(ev) {
        $('.doFade', this).add( $('.info', this) ).fadeIn(150);
    }).mouseleave(function() {
        $('.doFade', this).add( $('.info', this) ).fadeOut(150);
    });
});