Неправильно работает Math.random()

mrloregood · September 10, 2016

Как и любой новичок, шарясь по сайтам с ответами на всевозможные мои вопросы я нашёл код, который должен выводить две картинки в рандомном местоположении(написан здешним Sensei вроде), но он почему-то не работает. Подскажите ошибку.

<html>
	<head>
		<style type="text/css">
				
				html,
				body 
					{
						height: 100%;
					}

				img 	
					{
						position: absolute;
					}

		</style>
	</head>
	<body>
		<script>
					var img = document.querySelectorAll('img'),
					  i = 0,
					  max = img.length,
					  left,
					  top;

					for (; i &lt; max; i += 1) {
					  left = Math.round(Math.random() * (document.body.offsetWidth - 100)) + 'px';
					  top = Math.round(Math.random() * (document.body.offsetHeight - 100)) + 'px';
		

					  img[i].style.left = left;
					  img[i].style.top = top;
					}
		</script>
				<img src="http://savepic.ru/11286158.png" >
				<img src="http://savepic.ru/11330177.png">
	</body>
</html>

Drew96 · September 11, 2016

1. Код скрипта надо подключать в самом конце тега <boby>, перед его закрытием. Иначе он просто не увидит ваших изображений.

<html>
  <head>
  </head>
  <body>
    <img src="http://savepic.ru/11286158.png">
    <img src="http://savepic.ru/11330177.png">
    <script>
      //Сюда пишем код скрипта
    </script>
  </body>
</html>

2. Ошибка не в Math.random(), a в цикле. Вы случайно вставили не знак «меньше» (<), а его HTML-код «&lt»; Правильный цикл выглядит так:

for (i; i < max; i +=1) {
	//какой-то код
}

3. Не используйте в качестве переменной слово «top». Оно зарезервировано (тут можно почитать). Лучше напишите что-нибудь вроде «topPos» или что-нибудь другое. Для единообразия то же самое можно сделать и с переменной «left».

Скрытый текст


<html>
  <head>
    <style type="text/css">
      html,
      body 
        {
          height: 100%;
        }

      img   
        {
          position: absolute;
        }
    </style>
  </head>
  <body>
    <img src="http://savepic.ru/11286158.png">
    <img src="http://savepic.ru/11330177.png">
    <script>
          var img = document.querySelectorAll('img'),
            i = 0,
            max = img.length,
            leftPos,
            topPos;

          for (i; i < max; i +=1) {
            leftPos = Math.round(Math.random() * (document.body.offsetWidth - 100)) + 'px';
            topPos = Math.round(Math.random() * (document.body.offsetHeight - 100)) + 'px';

            img[i].style.left = leftPos;
            img[i].style.top = topPos;
          }
    </script>
  </body>
</html>

mrloregood · September 11, 2016

1 час назад, Drew96 сказал:
1. Код скрипта надо подключать в самом конце тега <boby>, перед его закрытием. Иначе он просто не увидит ваших изображений.
<html>
  <head>
  </head>
  <body>
    <img src="http://savepic.ru/11286158.png">
    <img src="http://savepic.ru/11330177.png">
    <script>
      //Сюда пишем код скрипта
    </script>
  </body>
</html>
2. Ошибка не в Math.random(), a в цикле. Вы случайно вставили не знак «меньше» (<), а его HTML-код «&lt»; Правильный цикл выглядит так:
for (i; i < max; i +=1) {
	//какой-то код
}
3. Не используйте в качестве переменной слово «top». Оно зарезервировано (тут можно почитать). Лучше напишите что-нибудь вроде «topPos» или что-нибудь другое. Для единообразия то же самое можно сделать и с переменной «left».
Скрыть содержимое
<html>
  <head>
    <style type="text/css">
      html,
      body 
        {
          height: 100%;
        }

      img   
        {
          position: absolute;
        }
    </style>
  </head>
  <body>
    <img src="http://savepic.ru/11286158.png">
    <img src="http://savepic.ru/11330177.png">
    <script>
          var img = document.querySelectorAll('img'),
            i = 0,
            max = img.length,
            leftPos,
            topPos;

          for (i; i < max; i +=1) {
            leftPos = Math.round(Math.random() * (document.body.offsetWidth - 100)) + 'px';
            topPos = Math.round(Math.random() * (document.body.offsetHeight - 100)) + 'px';

            img[i].style.left = leftPos;
            img[i].style.top = topPos;
          }
    </script>
  </body>
</html>

Большое спасибо, теперь буду более внимательно находить ошибки

Sign In

Неправильно работает Math.random()

Question

mrloregood

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

Drew96

Link to comment

Share on other sites

mrloregood

Link to comment

Share on other sites

Join the conversation

Similar Content

Обсуждения

Forums

Important Information