Помогите решить проблему
<div>
<div class="img"><img src="большое фото" class="image"></div>
<div class="new_img">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
</div>
</div>
<div>
<div class="img"><img src="большое фото" class="image"></div>
<div class="new_img">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
</div>
</div>
<div>
<div class="img"><img src="большое фото" class="image"></div>
<div class="new_img">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
<img src="маленькая фотка" rel="большое фото" class="big">
</div>
</div>
и т.д
Вот код, который использую для подмены src изображения.
$(function() {
var osrc = $('.image').attr('src');
$('.big').hover(
function() {
var nsrc = $(this).attr('rel');
$('.image').attr({src : ''+nsrc+''});
},
function() {
$('.image').attr({src : ''+osrc+''});
}
);
});
Работает, но неверно, меняется у всех .image картинка, которые есть на странице, а надо только у этого дива, в который он обрамлён!
Помогите решить проблему, замучился уже.
Спасибо огромное заранее!