0

我为图像翻转构建了一个 jQuery 函数，即当我将鼠标悬停在它们应该放大的特定图像上时。但问题是这些图像有两种类型，有时它们带有绿色边框，有时带有红色边框。当它们有红色边框时，图像名称以"RB"结尾。现在问题是不管图像是否包含 RB，它是否被放大了。我使用了一个布尔值作为决策参数，它的名字是"pos"。当我打印它时，会显示正确的值，但在代码逻辑中它都是错误的。

<script type="text/javascript">
            var preLoadImages=['../icons/alfresco64.png','../icons/RSS64.jpg',
                            '../icons/google_calendar64.png','../icons/connections64.png',
                            '../icons/linkedin64.png','../icons/salesforce64.png',
                            '../icons/sharepoint_2010_64.png'];

        var imgs=[];
        for(var i=0;i<preLoadImages.length;i++){
            imgs[i]=new Image();
            imgs[i].src=preLoadImages[i];
        }
        $(document).ready(function(){


            $('#slider img').mouseover(function(){
                var j;
                var imgFile=$(this).attr('src');
                var imgFileID=$(this).attr('id');

                if(imgFileID=="Alfresco"){
                    j=0;
                }
                if(imgFileID=="GoogleCalendar"){
                    j=2;
                }
                if(imgFileID=="Linkedin"){
                    j=4;
                }
                if(imgFileID=="Rss"){
                    j=1;
                }
                if(imgFileID=="Salesforce"){
                    j=5;
                }
                if(imgFileID=="Sharepoint"){
                    j=6;
                }
                if(imgFileID=="Connections"){
                    j=3;
                }
                if((j>=0)&&(j<=6)){
                var pos=/RB.png$/.test(imgFile);

                if(pos){
                    return false;
   } if(!pos){
                $(this).hover(
                function(){
                    $(this).attr('src',imgs[j].src);
        },
                function(){
                    $(this).attr('src',imgFile);
                }
       );
       }
                } 
            });
        });
    </script>

据我说，当图像 src 包含 RB 时，该方法应该返回 false。但它总是放大悬停时的图像。请帮助我是 jQuery 的新手。

4

2 回答 2

0

It's not a good idea to do recognition on name, after 2-3 weeks you will forget about this little thing. Put a html5 like attribute to your images and use it for making difference.

And if in only hover effect you can try to do it with clean css and skip the js. If you use css look how to make a 'sprite' and use it to boot loading speed.

于 2012-04-18T12:56:01.703 回答
0

如果您创建一个 jsFiddle 我可以提供帮助，但乍一看这可能是一个问题：

if (pos) {
   return false;
} 

if (!pos) { 
     ... 
}

将其更改为：

if (pos) {
   return false;
} else { 
     ... 
}
于 2012-04-18T14:38:16.720 回答