|
|
|
| На странице есть прямоугольник. После клика на него должна начаться
смена цвета, каждые 3 секунды, на случайный. После повторного клика
смена цветов останавливается. | |
|
|
|
|
|
|
|
для: technic611
(17.05.2012 в 18:04)
| |
//<?
var inProcess = false;
var si;
var letters = '0123456789ABCDEF'.split('');
$('#any').click(function() {
inProcess = !inProcess;
if (inProcess) {
si = setInterval(function() {
var color = '#';
for (var i = 6; i; i-- ) {
color += letters[Math.round(Math.random() * 15)];
}
$('#any').css({backgroundColor: color});
}, 3000);
} else {
clearInterval( si );
}
});
|
* исправлено | |
|
|
|
|
|
|
|
для: bishake
(17.05.2012 в 18:22)
| | Можно и без массива:
//<?
var color = '#';
for (var i = 6; i; i-- ) {
color += (Math.floor(Math.random()*16)).toString(16);
}
|
Может кто-то сумеет написать ещё проще с побитовыми операциями? :) | |
|
|
|
|
|
|
|
для: bishake
(17.05.2012 в 18:22)
| | не получается
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script>
var inProcess = false;
var i;
$('#any').click(function() {
inProcess = !inProcess;
if (inProcess) {
i = setInterval(function() {
$('#any').css({backgroundColor: '#'+((1<<24)*Math.random()|0).toString(16)});
}, 3000);
} else {
clearInterval( i );
}
});
</script>
<style>
.any
{
position: absolute;
overflow: auto;
width: 50px;
height: 50px;
left: 50%;
top: 50%;
margin-left: -320px;
background-color: #000000;
}
</style>
<html>
<div id="any" class=any> </div>
</html>
|
| |
|
|
|
|
|
|
|
для: technic611
(17.05.2012 в 18:44)
| | В document.ready поместите скрипт или же - в конец документа.
Я свой ответ исправил, вариант с ((1<<24)*Math.random()|0).toString(16) оказался не совсем верным :) | |
|
|
|
|
|
|
|
для: bishake
(17.05.2012 в 18:49)
| | не работает все равно
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script>
$(document).ready(function() {
var inProcess = false;
var si;
var letters = '0123456789ABCDEF'.split('');
$('#any').click(function() {
inProcess = !inProcess;
if (inProcess) {
si = setInterval(function() {
var color = '#';
for (var i = 6; i; i-- ) {
color += letters[Math.round(Math.random() * 15)];
}
$('#any').css({backgroundColor: color});
}, 3000);
} else {
clearInterval( si );
}
});
});
</script>
<html>
<div id="any" style= "background-color: #000000; width: 50px; height: 50px;"> </div>
</html>
|
| |
|
|
|
|
|
|
|
для: technic611
(17.05.2012 в 18:55)
| |
<script>
var inProcess = 0;
$(function(){
$('#box').click(function() {
inProcess ^= 1;
if (inProcess) {
si = setInterval(function() {
$('#box').css({backgroundColor:'#'+Math.floor(Math.random()*16777215).toString(16)});
}, 3000);
} else {
clearInterval( si );
}
});
});
</script>
<div id="box" style= "background-color:#000000;width:50px;height:50px;"></div>
|
| |
|
|
|
|
|
|
|
для: confirm
(17.05.2012 в 19:17)
| | извините не правильно был указан путь к библиотеке jQuery. работает. Расскажите что здесь происходит, пожалуйста
Math.floor(Math.random()*16777215).toString(16)})
|
| |
|
|
|
|
|
|
|
для: technic611
(17.05.2012 в 19:29)
| | Десятичное значение шестнадцатеричного числа FFFFFF равно 16777215. Math.random() генерирует числа с плавающей точкой от 0 до 1, поэтому, чтобы получить максимальное нам нужное, умножаем это на 16777215. Далее округляем в меньшую сторону (с тем же успехом вместо Math.floor можно применить parseInt), и преобразуем это число в строку в шестнадцатеричном виде. | |
|
|
|
|
|
|
|
для: confirm
(17.05.2012 в 19:17)
| | Ваш вариант допускает возможность появления не 6-значных цветов, неужели это не видно? | |
|
|
|
|
|
|
|
для: bishake
(17.05.2012 в 20:56)
| | Зачем смотреть, если это естественно? При трех значениях тоже получим цвет, при остальных будет проигнорировано. Но для случайного выбора цвета это разве важно? Я считаю нет. Если так принципиально можно добавить нижнюю границу. | |
|
|
|
|
|
|
|
для: confirm
(18.05.2012 в 04:09)
| | Разумеется важно. Представьте, что каждый месяц случайным образом выбирается, получите Вы зарплату или нет? Может теперь вы станете считать по-другому? | |
|
|
|
|
|
|
|
для: bishake
(18.05.2012 в 12:16)
| | Значится так - random() такой же случайный как образ бабушки с семечками у подъезда, его случайность, это случай. Если вы докажите, что он таки выдаст цвет с исправной случайностью от черного до белого и ни разу не повторившись, я сниму пред вами шляпу. А если нет, значит я имею право на вольности, какая к черту разница или повтор, или пропуск.
Что касается мест, где нужно тютелька в тютельку, знаю, сам не глуп. | |
|
|
|
|
|
|
|
для: confirm
(18.05.2012 в 12:54)
| | Давайте обратимся к "ТЗ" :)
> После клика на него должна начаться смена цвета, каждые 3 секунды, на случайный.
Из этого утверждения можно сделать однозначный вывод, что каждые 3 секунды цвет должен меняться на некий другой, то бишь HEX-код должен отличаться от предыдущего хотя бы на один символ.
В Вашем случае, вероятность того, что данное условие не выполнится, равна
0x100000 / 0xFFFFFF = 6.25%
|
Фактически, это значит, что каждая 16-ая попытка сменить цвет будет не удачной.
В случае, если формировать 6-значный HEX-код, вероятность невыполнения указанного выше условия равна
Это значит, что в теории неудачной будет одна из 16777215 попыток. Даже меняя цвет 100 раз в секунду, для такого совпадения потребуется около 2 суток, что очень далеко от реальной ситуации. | |
|
|
|
|
|
|
|
для: bishake
(18.05.2012 в 13:19)
| | Вот я в этом ТЗ вижу только одно - сменить, а чего, сколько, и по каким условиям нет.
Вам важна принципиальность? Я ответил - укажите нижний порог, например 100000, и в полемики необходимости не будет.
Вероятность, это магия, а я в нее не верю. ;)
PS. Это вам, чтобы успокоились, автора, по моему, это не так волнует как вас. )
'#'+(parseInt(Math.random()*15728640)+1048576).toString(16)
|
| |
|
|
|
|
|
|
|
для: confirm
(18.05.2012 в 13:33)
| | Дело не в принципиальности, а в несоответствии решения и поставленной задачи. Если сменить - значит сменить, а не оставить тем же в каком-то случае.
'#'+(parseInt(Math.random()*15728640)+1048576).toString(16)
|
Это решение, пожалуй, самое верное и короткое :) | |
|
|
|
|
|
|
|
для: bishake
(18.05.2012 в 14:19)
| | Я уже сказал - не вижу в поставленной задаче условия "обязательно от белого до черного". Так что "соответствие", это вопрос спорный, разрешить который может только автор. | |
|
|
|
|
|
|
|
для: bishake
(18.05.2012 в 14:19)
| | Кстати, если следовать "букве закона", то тогда так (все учесть):
$('#box').css({backgroundColor:'rgb('
+parseInt(Math.random()*255)+','
+parseInt(Math.random()*255)+','
+parseInt(Math.random()*255)+')'})
|
| |
|
|
|
|
|
|
|
для: bishake
(17.05.2012 в 18:49)
| | ваш вариант тоже работает, спасибо | |
|
|
|