小编Joh*_*erg的帖子

用很多选择器简化这个jQuery-Code

如何简化这段代码?鼠标事件都非常相似.因此应该有一种缩短代码的方法.

谢谢,约翰内斯

 var $allItems   = $('ul.image-grid li'),
    $kindertanzItems  = $('li[data-type=kindertanz]'),
    $urbanItems   = $('li[data-type=urban]'),
    $ethnoItems   = $('li[data-type=ethno]'),
    $gesundheitItems  = $('li[data-type=gesundheit]');


   $kindertanzItems.hover(function(){
    $allItems.each(function(){
     $(this).css("opacity","0.1"); 
    });
    $kindertanzItems.each(function(){
     $(this).css("opacity","1").css("background-color","#232628").css("border-color", "black"); 
    });
   }).mouseleave(function(){
    $allItems.each(function(){
     $(this).css("opacity","1"); 
    });
    $kindertanzItems.each(function(){
     $(this).css("background-color","#33373b").css("border-color", "#222527"); 
    });
   });


   $urbanItems.hover(function(){
    $allItems.each(function(){
     $(this).css("opacity","0.1"); 
    });
    $urbanItems.each(function(){
     $(this).css("opacity","1").css("background-color","#232628").css("border-color", "#101011"); 
    });
   }).mouseleave(function(){
    $allItems.each(function(){
     $(this).css("opacity","1"); 
    });
    $urbanItems.each(function(){
     $(this).css("background-color","#33373b").css("border-color", "#222527"); 
    });
   });


   $ethnoItems.hover(function(){
    $allItems.each(function(){
     $(this).css("opacity","0.1"); 
    });
    $ethnoItems.each(function(){
     $(this).css("opacity","1").css("background-color","#232628").css("border-color", "black"); 
    });
   }).mouseleave(function(){
    $allItems.each(function(){
     $(this).css("opacity","1"); 
    });
    $ethnoItems.each(function(){
     $(this).css("background-color","#33373b").css("border-color", "#222527"); 
    });
   });


   $gesundheitItems.hover(function(){
    $allItems.each(function(){
     $(this).css("opacity","0.1"); 
    });
    $gesundheitItems.each(function(){
     $(this).css("opacity","1").css("background-color","#232628").css("border-color", …
Run Code Online (Sandbox Code Playgroud)

jquery jquery-selectors

0
推荐指数
1
解决办法
107
查看次数

理解JavaScript速记(如果/ &&)

我试图理解别人写的这行代码:

myVar1 = myVar1 && myJsonData.myObj[filterName]['myKey'][0] === myFilterValue;
Run Code Online (Sandbox Code Playgroud)

有人可以告诉我这意味着什么(没有缩短)!?谢谢

javascript shorthand

0
推荐指数
1
解决办法
143
查看次数

标签 统计

javascript ×1

jquery ×1

jquery-selectors ×1

shorthand ×1