Показать сообщение отдельно
  #7 (permalink)  
Старый 01.12.2017, 18:23
Аватар для void()
Профессор
Отправить личное сообщение для void() Посмотреть профиль Найти все сообщения от void()
 
Регистрация: 11.08.2017
Сообщений: 208

Вот самый простой пример, который я смог придумать. Но он не подходит для боевого проекта. Если только для себя или в учебных целях.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Пример</title>
</head>
<body>

	<div class="owl-carousel"></div>
	<button onclick="sort();">Отсортировать</button>
	<script>

		/* Описываем здесь свои данные (например, ссылки на картинки по ключу цены) */
		var imges = {
			50: ['imges1', 'imges2', 'imges3','imges4'],
			100: ['imges5', 'imges6', 'imges7','imges8'],
			250: ['imges9', 'imges10', 'imges11','imges12']
		};

// Получаем owl-carousel в переменную
var carous = document.querySelector('.owl-carousel');

/* Это переменные, которые генерирует бегуток - значения ОТ и ДО */
var iFrom = 50;
var iTo = 250;

/* Перебераем данные и выводим в карусель только те, которые соответствуют требованиям from-to */
function sort(){
	for(var key in imges){
		if(key > iFrom && key < iTo){
			for(var k = 0; k < imges[key].length; k++){
				carous.innerHTML += '<img src="' + imges[key][k] + '">';
			}
		}
	}
}
</script>
</body>
</html>
Ответить с цитированием