tomnolane
@tomnolane
профессиональный разработчик

Проблема со слайдером (готовым). Как вставить в него картинки?

Взял готовый слайдер: этот.
Работает, всё хорошо.
Хочу сделать так, чтобы при добавлении картинки, она автоматически включалась внутрь.

Основа каждой картинки примерно такая (в слайдере):
<div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:800px;height:356px;overflow:hidden;">
<div>
                <img data-u="image" src="img/02.jpg" />
                <img data-u="thumb" src="img/thumb-02.jpg" />
            </div>
<div>
                <img data-u="image" src="img/03.jpg" />
                <img data-u="thumb" src="img/thumb-03.jpg" />
            </div>
.... 
</div>


допустим .. я хочу сделать тоже самое, но через script:
var a = [ ["img/01.jpg", "img/thumb-01.jpg"] , ["img/02.jpg","img/thumb-02.jpg"]];
		for(var i = 0; i < 2; i++)
		{
			  var div = document.createElement('div');
			  div.innerHTML = '<img data-u="image" src='+a[i][0]+' /><img data-u="thumb" src='+a[i][1]+' />';
              document.body.appendChild(div);
		}


но в этом случае (хотя html получается такой же) картинки вставляются не в слайдер, а под ним.
b7f0bc2729b140398043dc472a9b1f96.JPG

из-за чего может быть такое?? и в какую сторону "копать"? Пробовал с этим...
$(document).ready(function(){
  код
});

результат тот же. Может вставлять(создавать теги) через php???

п.с. мой скрипт append тегов(div'ов) естественно внутри блока(дива) слайдера
29f62e21174a4bfe8dfa742a98f6cff3.JPG
(п.с.с. не ругайте за notepad++ , просто в brackets у меня открыт проект основной) и не хочу переключать)
  • Вопрос задан
  • 343 просмотра
Решения вопроса 1
tomnolane
@tomnolane Автор вопроса
профессиональный разработчик
с помощью JS не смог разобраться. Сделал через php:
<?
function getImgName($pathtoimg,$album) {
   
$pictures = array(); 
if ($dir = opendir($pathtoimg.$album."/"))  {     
     while (false !== ($file = readdir($dir))) {         
         if ($file == "." || $file == ".." || (is_dir($pathtoimg.$album."/".$file))) continue; 
          $pictures[] = $file; 
          $i++;  
     } 
     closedir($dir); 
} 
sort($pictures);
return $pictures;
}

$t = getImgName('img','/image');  
$t2 = getImgName('img','/thumb');  
?>


и потов там, куда вставляются теги с img:
<?
		 
		 for ($i = 0; $i < count($t); $i++) {  
		 
		 echo '<div><img data-u="image" src="img/image/'.$t[$i].'" /><img data-u="thumb" src="img/thumb/'.$t2[$i].'" /></div>'; 
}
		
		?>


благодарю всех за отклик! п.с. если предпологаете как сделать через js (классику либо/и jquery) - напишите, прикреплю к овтетам (и себе для развития)!
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@k0nsu1
Полагаю нужно делать запуск слайдера после вставки изображений
Ответ написан
Krasnodar_etc
@Krasnodar_etc
little front
Так ты же добавляешь блоки с картинками просто в body, а не в блок-слайдер, не?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы