Присвоить рандомно класс
Привет. Нужно чтобы класс show присваивался рандомно к li. В данном коде он последовательно присваивается по кругу от li к li.
$('#hide_right li:first-child').addClass('');
setInterval(function () {
var show_element = $('#hide_right li.show');
var next_element = $('#hide_right li.show').next();
if (next_element.length == 0) {
next_element = $('#hide_right li:first-child');
}
show_element.removeClass('show');
next_element.addClass('show');
}, 2000);
});
Думаю в этом направлении. Вначале следует сгенерировать рандомный порядок li наверное:
function numLi(){
var element = $('#hide_right li');
var min = 1;
var max =element.length;
for (var i = 0; i < 1 ; i++){
randomLi = Math.floor(Math.random() * (max - min +1)) + min;
}
return randomLi;
}
А вот дальше сомневаюсь) |
ureech, так надо?
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style>
.show{display: block;}
li {display: none;}
</style>
<ul id="hide_right">
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
<li>Item5</li>
</ul>
<script>
var max =$('#hide_right li').length;
setInterval(function () {
var min = 1;
randomLi = Math.floor(Math.random() * (max - min +1)) + min;
$('#hide_right li.show').removeClass('show');
$('#hide_right li').eq(randomLi-1).addClass('show');
}, 1000);
</script>
|
Manyasha,
а без min ? |
ну, да.Можно и без)
randomLi = Math.floor(Math.random() * (max+1)); Спасибо,Manyasha |
рандомно без повторений
ureech,
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style>
.show{display: block;}
li {display: none;}
</style>
<ul id="hide_right">
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
<li>Item5</li>
</ul>
<script>
var li = $('#hide_right li').get(), el = rnd(li), temp = [];
function rnd(li)
{
var index = Math.floor(Math.random() * li.length);
return li.splice(index,1)
}
function show()
{
li.length || (li = temp, temp = []);
$(el).removeClass('show');
temp = temp.concat(el);
el = rnd(li);
$(el).addClass('show');
window.setTimeout(show, 1000)
}
show()
</script>
|
Цитата:
randomLi = Math.floor(Math.random() * max);
//...
$('#hide_right li').eq(randomLi).addClass('show');
|
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style>
.show{display: block;}
li {display: none;}
</style>
<ul id="hide_right">
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
<li>Item5</li>
</ul>
<script>
var li = $('#hide_right li'), x;
(function show(){
do index = Math.floor(Math.random() * li.length);
while(x == index);
li.eq(x).removeClass('show');
x = index;
li.eq(index).addClass('show');
setTimeout(show, 1000);
}());
</script>
без повторений |
j0hnik,
А чему равно x? |
Цитата:
|
Dilettante_Pro,
x = index; предыдущей генерации Спасибо за замечание :) рони цикл убрал, генерация лайтовый процесс, тем более его вероятность тут 20%. Конкатенация например гораздо более тяжелый процесс ;) |
| Часовой пояс GMT +3, время: 10:17. |