Как можно узнать\вычислить кол-во доступных картинок

[desertFox]

Добрый вечер.

Имеется код для смены картинок при наведении курсора:
js:

$(document).ready(function() {
  $('.short-story a img').each(function() {
    var slideImg = $(this);
	var iid;
	var curImg = 0;
	var imgSrc = new Array;
	
    var imageSrc   = slideImg.attr("src");
    var imgPatch  = imageSrc.split('_');
    imgSrc = [imgPatch[0] + '_0' + '0' + '.jpg', imgPatch[0] + '_0' + '1' + '.jpg', imgPatch[0] + '_0' + '2' + '.jpg'];
	
	
	slideImg.bind('mouseover', function() {			
			iid = setInterval(function() {				
				curImg < imgSrc.length-1 ? ++curImg : curImg = 0;				
				slideImg.attr("src", imgSrc[curImg]);								
			}, 400);					
		});
		
	slideImg.bind('mouseout', function() { clearInterval(iid); curImg = 0; this.src=imgSrc[0]});
  });
});

html:

<div id="dle-content">
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2604" src="/uploads/thumbs/2014-04-14/2604/xvid_00.jpg" width="200" height="140"></a>
  </span>
</div>
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2605" src="/uploads/thumbs/2014-04-15/2605/xxvid_00.jpg" width="200" height="140"></a>
  </span>
</div>
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2606" src="/uploads/thumbs/2014-04-16/2606/xxxvid_00.jpg"  width="200" height="140"></a>
  </span>
</div>
</div>

у картинок всегда окончание в таком формате - _00.jpg, _01.jpg, _02.jpg ... и т.п.

Хотелось бы в js сделать массив картинок, который создавался динамически, примерно так:

imgPatch[0] + '_0' + i + '.jpg'

ну Вы меня поняли), в переменную "i" занести порядковый номер картинки, изначально кол-во картинок не известно, вот в этом и основная задачка

реально это сделать с помощью js? может логика скрипта не верна и есть уже готовые решения по теме?

[desertFox]

решил в цикле проверить загрузку 10 изображений, если картинка не загрузилась то цикл должен прерваться:

$(document).ready(function() {
  $('.short-story a img').each(function() {
    var slideImg = $(this);
	var iid;
	var curImg = 0;
	var imgSrc = new Array;
	
    var imageSrc   = slideImg.attr("src");
    var imgPatch  = imageSrc.split('_');
	

	imgSrc[0] = imgPatch[0] + '_0' + '0' + '.jpg';

	
	slideImg.on('mouseover', function() {




	
	var col = 0;

	for( var i = 1; i < 10; i++ )
	{
	  $(this).parent().prepend('<img alt="" src="' + imgPatch[0] + '_0' + i + '.jpg" id="clonImg' + i + '">');

	  if(('#clonImg'+ i).length > 0)
	  {
	  $('#clonImg'+ i).remove();
	  col++;
	  imgSrc[col] = imgPatch[0] + '_0' + col + '.jpg';
	  }
	  else {break;}
	}



	
	
			iid = setInterval(function() {				
				curImg < imgSrc.length-1 ? ++curImg : curImg = 0;				
				slideImg.attr("src", imgSrc[curImg]);								
			}, 400);					
		});
		
	slideImg.on('mouseout', function() { clearInterval(iid); curImg = 0; this.src=imgSrc[0]});
  });
});

не соображу как верно условие сделать, это - if(('#clonImg'+ i).length > 0), не сработало

[tsigel]

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<div id="dle-content">
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2604" src="/uploads/thumbs/2014-04-14/2604/xvid_00.jpg" width="200" height="140"></a>
  </span>
</div>
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2605" src="/uploads/thumbs/2014-04-15/2605/xxvid_01.jpg" width="200" height="140"></a>
  </span>
</div>
<div class="short-story">
  <span class="short-title1">
    <a href='index2.html'><img id="2606" src="/uploads/thumbs/2014-04-16/2606/xxxvid_02.jpg"  width="200" height="140"></a>
  </span>
</div>
</div>
<script>

$(document).ready(function() {

   var imgSrc = [];

   $('.short-story a img').each(function() {

        imgSrc.push($(this).attr("src").split('_')[0] + "_");

   });

   alert(imgSrc);

   function getSrcByNum(num) {

     return imgSrc[num] + (((num + "").length == 2) ? num : "0" + num) + ".jpg";

   }

   alert(getSrcByNum(1));
});

</script>

Честно говоря не совсем понял что вы хотите, но массив путей который вы описали можно сделать так.

[desertFox]

спасибо, но не то,

с помощью php на экран выводится только одна картинка, вот и пытаюсь проверить есть ли в той же папке ещё картинки и если есть то менять одну на следующую,

их кол-во не более 10 штук, вот я и пытался в циклы вывести предполагаемые адреса картинок, а потом проверить - если адрес не битый и картинка загрузилась значит записать в переменную..

пример что хочу сделать на киносайтах - выводится превью фильма, при наведение на превьюшку листаются кадры, но изначально выводится только одна картинка а остальные с помощью js

[tsigel]

А, понятно. Вообще данную задачу лучше решать на сервере, и передавать в js количество картинок от сервера. Но если очень хочестся сделать через Ж, то можно так:

$(document).ready(function() {

   for (var i = 0; i < 10; i++) {

      loadImage(i);

   }

    function loadImage(index) {

       var image = new Image()
       image.onload = function () {
           //данная картинка существует и загружена доступна по this длайте с ней что хотите
       };
       image.onerror = function () {
          //Картинки с таким номером не найдено!
       }
       image.src = "someUrl" + index + ".png";
    }   
});

[desertFox]

огромное спасибо, заработало, мне как раз и надо было через Ж)))