Включение Javascript в JQuery

Question

Привет переполнением стека,

Я новичок в изучении JQuery и просто пытается конденсироваться некоторые примеры кода вниз, как бы я идти о следующем.

При наведении на иконку #navweb выберите все элементы с классом .web, а затем измените фон каждого из этих элементов на url (back/"+ i +" .png), где i - цикл JS, и затем fadeIn эти новые фоны.

Вот JS я есть на ток, который работает (за FadeIn исключением)

function showweb() { 
for(var i=1; i < 45; i++){ 
var el = document.getElementById("im"+(i)); 
if(el && /web/.test((el ||{}).className)){ 
    el.style.backgroundImage = "url(back/"+ i +"col.png)";} 
} 
} 

function hideweb() { 
for(var i=1; i < 45; i++){ 
    var el = document.getElementById("im"+(i)); 
    if(el && /web/.test((el ||{}).className)){ 
     el.style.backgroundImage = "url(back/"+ i +".png)";} 
    } 
} 

я начал, и получил что-то вроде этого, но он не работает, еще потому что я знаю его не полная, может вы использовать счетчики в jQuery?

$('#navweb').mouseover(function(){ 

var i = 1; 
$(".web").each(function(){ 
$(this).css('background-image', 'url(back/" + i + ".col.png)'); 
i += 1; 
}); 

}); 

Большое спасибо всем ответам.

EDIT: Благодаря всем ответам, Guffa доказала свою идеальность и скромен для моего использования; Я также добавил метод fadeIn(), но, похоже, не срабатывает при наведении курсора мыши?

$('#navweb').mouseover(function(){ 

    $(".web").each(function(){ 
    var i = parseInt(this.id.substr(2)); 
    $(this).css('background-image', 'url(back/' + i + 'col.png)').fadeIn(1000); 
    }); 

}); 

Answer 1

Вы можете получить номер с идентификатором элемента:

$('#navweb').mouseover(function(){ 

    $(".web").each(function(){ 
    var i = parseInt(this.id.substr(2)); 
    $(this).css('background-image', 'url(back/' + i + '.col.png)'); 
    }); 

}); 

Answer 2

Вы имели небольшую ошибку здесь: 'url(back/" + i + ".col.png)', он должен быть, как я писал ниже одинарные кавычки.

$('#navweb').mouseover(function(){ 
    var i = 1; 
    $('.web').each(function(){ 
     $(this).css('background-image', 'url(back/' + i + '.col.png)'); 
     i += 1; 
    }); 
});