如果这是一个相当普遍的问题,我很抱歉,但我向你保证,我在过去的两天里一直在阅读,看看我是否能自己解决这个问题,但唉,我在你的脚下希望得到一些一个建议。我仍处于学习 javascript 的初级阶段。
基本上,我有一个 div 类包含的一系列缩略图,该类具有重复的背景图像,赋予它微妙的纹理。我还有一些 java 脚本,当鼠标悬停在缩略图上时,它成功地将单个 div 容器突出显示为蓝色。我遇到的问题是纯蓝色效果与我为缩略图 div 选择的现有背景图像不太吻合。在发生蓝色悬停效果时,我一直在尝试打开/关闭背景图像,但我只能在单个鼠标悬停/悬停后永久关闭它。
这是javascript:
// this controls the entire div tag and turns it blue
$('.pGrid div a').hover(
function(){
//this if-statement should toggle whether or not the striped background shows when the mouse is hovering
if ($('.pGrid div a').hover !=0) {
$('.pGrid div a').parent().css({ backgroundImage: "none" });
}
else {
$('.pGrid div a').parent().style({ backgroundImage: "url('../images/background_stripes_white.gif')" });
}
//mouse over turn div blue
$(this).parent().stop().animate({
backgroundColor: "#006699",
color: "#ffffff"
}, 350);
// this controls the word-highlight part
$(this).stop().animate({
backgroundColor: "#006699",
color: "#ffffff"
}, 350);
},
// mouse out
function(){
$(this).parent().stop().animate({
backgroundColor: "#d0d0d0",
color: "#000000"
}, 350);
$(this).stop().animate({
backgroundColor: "#d0d0d0",
color: "#006699"
}, 350);
});