Как правильно использовать Math.random?

В этом примере https://jsfiddle.net/x29vyo2q/2/ в консоли выдает ошибку - Cannot read property ‘Math’ of undefined (div должен появляться произвольно в пределах 200px по Х и У).
Если в скобках поместить выражение:
var x = event.(Math.round(Math.random()*200)); - тоже ошибка (как бы в скобки нельзя)

И почему не выполняется условие из второй функции?(блок не исчезает). По нему даже ошибка не выводится в консоль

как насчет такого варианта? https://jsfiddle.net/x29vyo2q/4/

не стоит очень часто обращаться к дом элементу, лучше его закешировать:
var block = document.getElementById("block");

1 симпатия

Зачем вы вообще используете event, естественно он undefined, т.к. setInterval ничего не передает в showBl, делайте как ответил Nikolay.

И почему не выполняется условие из второй функции?(блок не исчезает). По нему даже ошибка не выводится в консоль

hideBl очень даже выполняется, просто у вас в css уже указано для блока display: none, если уберете его - увидите что блок исчезает через ~1 сек.

1 симпатия

спасибо, получается что без position fixed Math.random не работает…

Math.random не причем. Чтобы элемент перемещать по странице он должен иметь “неблочное” позиционирование, например'fixed' или 'absolute', тогда для этого элемента будет работать style.top, style.left и т.д.

ага, а в другом случае - надо было бы marginTop, marginLeft использовать, если relative или не указано позиционирование…

все верно.

Я прошу прощения, но или я Вас не так понял, либо Вы не совсем правы.

На данный момент в спецификации CSS2 определены 6 видов позиционирования:

position:

  • static
  • absolute
  • fixed
  • relative
  • initial
  • inherit;

(более подробно можно прочесть здесь: http://www.w3schools.com/cssref/pr_class_position.asp)

Позиционирование “static” применяется по умолчанию. С ним свойства “top”, “left”, “right”, “bottom” не работают т.к. это позиционирование предполагает размещение элементов в том порядке, в котором они обозначены в документе.

В свою очередь свойства “top”, “left”, “right”, “bottom” работают с absolute, fixed, relative позиционированием.

Таким образом “margin-top”, “margin-left” нужно использовать в случаях со static позиционированием, а свойства “top” и “left” прекрасно работают с relative.

1 симпатия

по видимому не совсем))) (на счет relative), спасибо за замечание