Показать сообщение отдельно
  #2 (permalink)  
Старый 09.01.2017, 01:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Anna_Medvid,
для этого есть раздел Общие вопросы Javascript
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    #ball {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      border: 8px solid black;
      -webkit-box-shadow: 0px 1px 30px 0px rgba(0, 0, 0, 0.75);
      -moz-box-shadow: 0px 1px 30px 0px rgba(0, 0, 0, 0.75);
      box-shadow: 0px 1px 30px 0px rgba(0, 0, 0, 0.75);
      background: black;
      position: absolute;
      top: 100px;
      left: 100px;
      transition: all 1s cubic-bezier(0,-0.96,.84,1.63);
    }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function(){
+function fn()
{
 var col1, col2, col3, topLeft;

    col1 = Math.round(Math.random()*255); // рандомно вибираються кольори від 0 до 255
    col2 = Math.round(Math.random()*255);
    col3 = Math.round(Math.random()*255);
    Top = Math.random()*($(window).height()-120);
    Left = Math.random()*($(window).width()-120);

  $("#ball").css({
    background: 'rgb('+col1+',' +col2+','+col3+')',
    border: '8px solid rgb('+col2+',' +col3+','+col1+')',
    boxShadow: '0px 1px 30px 0px rgba('+col1+','+col2+','+col3+',0.75)',
    left: Left+'px',
    top: Top+'px'
  });
  window.setTimeout(fn, 1500)
}()

  });


  </script>
</head>

<body>

<div class="wrapper">


    <div id="ball"></div>


</div>

</body>
</html>
Ответить с цитированием