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

jQuery-Marquee
Lefseq,
startVisible
https://github.com/aamirafridi/jQuery.Marquee
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
.marquee {
  width: 300px;
  overflow: hidden;
  border: 1px solid #ccc;
  background: #ccc;
  height: 300px;
}


  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://cdn.jsdelivr.net/jquery.marquee/1.4.0/jquery.marquee.min.js"></script>
  <script>
$(function() {
    $('.marquee').marquee({
    //speed in milliseconds of the marquee
    duration: 15000,
    //gap in pixels between the tickers
    gap: 50,
    //time in milliseconds before the marquee will start animating
    delayBeforeStart: 0,
    //'left' or 'right'
    direction: 'up',
    //true or false - should the marquee be duplicated to show an effect of continues flow
    duplicated: true,
    startVisible : true
});
});
  </script>
</head>

<body>
<div class="marquee">
<div style="background:#FF0000; margin-bottom:20px;">1111111111</div>

<div style="background:#FF0000; margin-bottom:20px;">22222222222</div>

<div style="background:#FF0000; margin-bottom:20px;">333333333333</div>

<div style="background:#FF0000; margin-bottom:20px;">4444444444444</div>

<div style="background:#FF0000; margin-bottom:20px;">555555555555555</div>

<div style="background:#FF0000; margin-bottom:20px;">6666666666666</div>

<div style="background:#FF0000; margin-bottom:20px;">77777777777</div>

<div style="background:#FF0000; margin-bottom:20px;">8888888888888</div>

<div style="background:#FF0000; margin-bottom:20px;">99999999999999</div>

</div>

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