0

如果这是一个相当普遍的问题,我很抱歉,但我向你保证,我在过去的两天里一直在阅读,看看我是否能自己解决这个问题,但唉,我在你的脚下希望得到一些一个建议。我仍处于学习 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);
        }); 
4

2 回答 2

0

问题已解决。我不得不取消 if-else 语句,并在每个函数中放置一行代码,说明要么将背景设置为无,要么切换回原来的。此外,事实证明我引用的文件扩展名都错了,不得不删除“../”部分。感谢您的帮助@Diodeus 非常感谢!

于 2013-02-24T08:43:03.583 回答
0

无需更改背景图像,只需交换 CSS 类名即可。一张有图片,一张没有。

您还应该display:block在 A-tag 上使用并直接(通过 CSS 类)而不是父项应用背景。

于 2013-02-21T22:33:55.770 回答