Помогите с бегущей строкой
Все привет. Имеется код простой бегущей строки, движение снизу-вверх. Подскажите, как исправить этот код так, чтобы при обновлении страницы строчки начинали двигаться не с самого низа, а продолжали движение находясь у верхней границы?
<div class="marquee-6"> <marquee bgcolor="#f9f9f9" scrollamount="1" direction="up"><br /> <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> </marquee> </div> |
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>
|
рони, спасибо большое!
|
| Часовой пояс GMT +3, время: 09:46. |