مشکل با نقطه شروع اسلاید شو

[leilaaa]

من قبلا یه اسلاید شو ساده نوشته بودم به صورت


<div id="slideshow">
<div class="slide">
<img src="'.$img1.'" >
<img src="'.$img2.'" >
<img src="'.$img3.'" >
</div>
<i class=" fa fa-chevron-left prev" > </i>
<i class=" fa fa-chevron-right next" > </i>
</div>

که با کد jquery ساده ای به شکل


$('.slide img:gt(0)').hide();

$('.next').click(function() {
$('.slide img:first').fadeOut().next().fadeIn().end().append To('.slide');
});
$('.prev').click(function() {
$('.slide img:first-child').fadeOut();
$('.slide img:last-child').prependTo('.slide').fadeOut();
$('.slide img:first-child').fadeIn();
});


به درستی کار می کرد ، در واقع اسلاید شو از عکس "اول" شروع می شد و ادامه پیدا می کرد. حالا مشکل من تو تغییر این کده ! من تو صفحه محصولاتم یه div به نام frame دارم که خودش از 3 div داخلی به نام subframe تشکیل شده و داخل هر کدوم یکی از این عکساست. حالا من می خوام وقتی کاربر روی یکی از این سه عکی کلیک کرد، اسلاید شویی باز بشه که این سه عکس به ترتیب و با شروع از عکسی که کاربر روش کلیک کرده ، نشون بده! مشابه http://www.bamilo.com/bt2046-bluetooth-handsfree-jabra-mpg270.html
البته تلاش های انجام دادم ولی بی نتیجه !:( مثلا




$('.subframes').click(function(){

$("#slideshow").animate({opacity:1},700);
var src= ($(this).attr('src'));

$('.slide img:last').attr('src',src);


$('.next').click(function() {
$('.slide img:first').fadeOut().next().fadeIn().end().append To('.slide');
});


$('.prev').click(function() {
$('.slide img:first-child').fadeOut();
$('.slide img:last-child').prependTo('.slide').fadeOut();
$('.slide img:first-child').fadeIn();

});
});



لطفا کمک کنید ، خیلی کلافه شدم

[leilaaa]

دوستان مشکل من هیچ راهکاری نداره؟

[upper of min]

سلام یه آموزش ساخت اسلاید شو هست میتونید توی لینک زیر ببینید اون رو

http://www.uplooder.net/files/cd4e34dcea2522a6134f9a4883bc2534/01-slideShow-edit.rar
http://www.uplooder.net/files/deabded7cde3ecfbb1cd0700cce936d7/02-album-edit.rar