I would like to add a kind of automatic scrolling in my html, with start and stop buttons, and I do not know how to do it.
I would like that when you click start, the attribute scrolls down slowly, and when you click stop, stop where you are. A good example of this service is the "auto scrolling" of figures, from Club Cipher .
I'm sorry, I'm a beginner. Thanks in advance.
To make this effect simple enough, just use the window method. scroll .
With this method you can change the X and Y coordinates. Ex:
window.scroll(x-coord, y-coord);
If you'd like something less "locked in", you can use the window.requestAnimationFrame
To pause, just store the ID returned by the requestAnimationFrame function and use it in the cancelAnimationFrame function.
Here's an example:
let scrollPosition = 0;
const velocity = 2;
let animation; //Armazena o ID da animação. Isso servirá para quando quiser pausa-la.
/* Botão para iniciar animação */
document.querySelector("#play").addEventListener("click", () => {
rolarPagina("#cifra2")
});
/* Botão para pausar animação */
document.querySelector("#pause").addEventListener("click", () => {
cancelAnimationFrame(animation)
});
/* Função para rolar a página */
function rolarPagina(element) {
window.scroll(0, scrollPosition += velocity);
if (document.querySelector(element).offsetTop <= scrollPosition) {
return;
}
animation = requestAnimationFrame(() => {
rolarPagina(element);
})
}#pause, #play {
position:fixed;
right: 0;
width: 50px;
}
#play {
right: 55px;
}<button type="button" id="pause">▌ ▌</button>
<button type="button" id="play">►</button>
<div id="cifra">
<h3>Epica - Cry For The Moon</h3>
<pre><b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>A7</b>
Forever and ever!
<b>Dm/A</b> <b>Bb/F</b>
Indoctrinated minds so very often
<b>Dm/A</b>
Contain sick thoughts
<b>Bb/F</b> <b>C/G</b> <b>Dm/A</b>
And commit most of the evil they preach against
Instrumental: <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>E5</b> (2x)
<b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>D#5</b> <b>C5</b>
<b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>F5</b> <b>E5</b>
<b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>E5</b>
<b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>G5</b> <b>A7</b>
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Don't try to convince me
<b>D5</b>
With messages from God
<b>D#5</b> <b>D5</b> <b>D5</b> <b>D#5</b>
You accuse us of sins
<b>C/G</b>
Committed by yourselves
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
It's easy to condemn
<b>D5</b> <b>D#5</b> <b>D5</b>
Without looking in the mirror
<b>D5</b> <b>D#5</b> <b>C/G</b> <b>Bb/F</b> <b>A7</b>
Behind the scenes (Behind the scenes opens... reality)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Dm</b>
Forgiveness is not for sale Nor is the will to forget
<b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Virginity has been stolen
<b>D5</b> <b>D#5</b>
At very young ages
<b>D5</b> <b>D5</b> <b>D#5</b>
And the extinguisher
<b>C/G</b>
Loses it's immunity
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Morbid abuse of
<b>D5</b> <b>D#5</b> <b>D5</b>
Power in the Garden of Eden
<b>D5</b> <b>D#5</b> <b>C/G</b> <b>Bb/F</b> <b>A7</b>
Where the apple (Where the apple gets a youthful face, a youthful face!)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Dm</b>
Forgiveness is not for sale Nor is the will to forget
<b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>A7</b>
Forever and ever!
(Instrumental)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Em</b>
Forgiveness is not for sale Nor is the will to forget
<b>Em</b> <b>C</b> <b>B7</b> <b>C</b> <b>B7</b>
You can't go on hiding yourself Behind
<b>Em</b> <b>C</b>
Old fashioned fairytales
<b>B7</b> <b>C</b> <b>B7</b> <b>Em</b>
And keep washing your hands in innocence</pre>
</div>
<div id="cifra2">
<h3>Epica - Storm The Sorrow</h3>
<pre>Intro 2x: <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
<b>Bm</b> <b>G</b> <b>Bm</b>
Along the way I find myself
<b>D</b> <b>D/C#</b>
To be confined within me
<b>Bm</b> <b>G</b> <b>D</b> <b>Em</b> <b>C</b>
No place for any other's mind to interfere,
<b>Bm</b>
To grasp the meaning of it all
<b>D</b> <b>D/C#</b>
To overcome my limits
<b>Bm</b> <b>D</b> <b>Em</b> <b>F#</b>
And dance away from any void and empty tones,
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Just tell me why
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Just tell me how I can survive this time
<b>Bm</b> <b>G</b> <b>Bm</b>
Believe yourself and look away
<b>D</b> <b>D/C#</b>
From all that's right within you
<b>Bm</b> <b>G</b> <b>D</b> <b>Em</b> <b>C</b>
Leave all your worries at the door and drift away,
<b>Bm</b> <b>G</b> <b>Bm</b>
I've tried to peer into the core
<b>D</b> <b>D/C#</b>
But could not storm the sorrow
<b>Bm</b> <b>D</b> <b>Em</b> <b>F#</b>
My hollow heart has bled me dry, left me to stray
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Another time without a trace,
<b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Condemn me now
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Send me to hell For I'm already failing
(refrão I)
<b>Em</b>
Intertwine the lines
<b>Bm</b>
That swim beneath the dark
<b>D</b>
Realize the pain we live in
<b>A</b>
Demonize the need we reel in, no
<b>Em</b> <b>Bm</b>
In my memories I'll dig deep enough to know
<b>D</b>
Centuries of dreams unending
<b>A</b> <b>Bm</b>
Another me that yielded tears when someone had betrayed
<b>Bm</b> (<b>G</b>) <b>Bm</b>
No time should ever go to waste
<b>D</b> <b>D/C#</b>
It's not that complicated
<b>Bm</b> <b>G</b> <b>D</b>
You're free to live your life at ease
<b>Em</b> <b>C</b>
No more restraints
<b>Bm</b> (<b>G</b>) <b>Bm</b>
No heed for shadows on your way
<b>D</b> <b>D/C#</b>
That try to steal your laughter
<b>Bm</b> <b>D</b> <b>Em</b>
Your light will drive them all away
<b>F#</b>
Be confident
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Will I refrain?
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Can I repent?
<b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Will you be there?
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Erase the page For I'm alone and ailing
(volta para refrão I)
<b>C</b>
<b>Bm</b> <b>C</b>
So, this is my life and it can't break me down
<b>Bm</b> <b>C</b>
Go, I will decide who can come in and heal my disease
<b>Bm</b>
Burn it in flames
<b>Bm</b>
Kill it and maim
<b>C</b>
Why can't you see that you need to be freed?
(refrão II - piano)
<b>Em</b> <b>Bm</b>
Intertwine the lines beneath the dark
<b>D</b>
Every bit of pain we're feeling
<b>A</b>
Every other solemn life, no
<b>Em</b> <b>Bm</b>
In the memories you will find somehow
<b>D</b>
There used to be a dream unending
<b>A</b>
No more need to be alone
(refrão III - sobe 1 tom)
<b>F#m</b>
Intertwine the lines
<b>C#m</b>
That swim beneath the dark
<b>E</b>
Realize the pain we live in
<b>B</b>
Demonize the need we reel in, no
<b>F#m</b> <b>C#m</b>
In my memories I'll dig deep enough to know
<b>E</b>
Centuries of dreams unending
<b>B</b> <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Another me that yielded tears when someone had betrayed
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Someone had betrayed
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b></pre>
</div>The Play and Pause buttons will also increase and decrease speed.
With jQuery it's also pretty easy. Just use the animate method
To pause, just use:
$('html, body').stop();
Example:
$("#play").click(function() {
/* Captura o elemento que desejamos ir */
var target = $( $("#cifra2") );
$('html, body').animate({
scrollTop: target.offset().top //Captura a posição do elemento
}, 1000); //Tempo de animação em milissegundos
});
$("#pause").click(function() {
$('html, body').stop();
});#pause, #play {
position:fixed;
right: 0;
width: 50px;
}
#play {
right: 55px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttontype="button" id="pause">▌ ▌</button>
<button type="button" id="play">►</button>
<div id="cifra">
<h3>Epica - Cry For The Moon</h3>
<pre><b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>A7</b>
Forever and ever!
<b>Dm/A</b> <b>Bb/F</b>
Indoctrinated minds so very often
<b>Dm/A</b>
Contain sick thoughts
<b>Bb/F</b> <b>C/G</b> <b>Dm/A</b>
And commit most of the evil they preach against
Instrumental: <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>E5</b> (2x)
<b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>D#5</b> <b>C5</b>
<b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>B5</b> <b>F5</b> <b>E5</b>
<b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>E5</b>
<b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>D5</b> <b>F5</b> <b>G5</b> <b>A7</b>
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Don't try to convince me
<b>D5</b>
With messages from God
<b>D#5</b> <b>D5</b> <b>D5</b> <b>D#5</b>
You accuse us of sins
<b>C/G</b>
Committed by yourselves
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
It's easy to condemn
<b>D5</b> <b>D#5</b> <b>D5</b>
Without looking in the mirror
<b>D5</b> <b>D#5</b> <b>C/G</b> <b>Bb/F</b> <b>A7</b>
Behind the scenes (Behind the scenes opens... reality)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Dm</b>
Forgiveness is not for sale Nor is the will to forget
<b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Virginity has been stolen
<b>D5</b> <b>D#5</b>
At very young ages
<b>D5</b> <b>D5</b> <b>D#5</b>
And the extinguisher
<b>C/G</b>
Loses it's immunity
<b>D5</b> <b>D5</b> <b>D#5</b> <b>D5</b>
Morbid abuse of
<b>D5</b> <b>D#5</b> <b>D5</b>
Power in the Garden of Eden
<b>D5</b> <b>D#5</b> <b>C/G</b> <b>Bb/F</b> <b>A7</b>
Where the apple (Where the apple gets a youthful face, a youthful face!)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Dm</b>
Forgiveness is not for sale Nor is the will to forget
<b>Dm</b>
Follow your common sense
<b>Am</b>
You cannot hide yourself
<b>Gm</b> <b>F</b> <b>Gm</b> <b>A7</b>
Behind a fairytale forever and ever
<b>Dm</b>
Only by revealing the
<b>Am</b>
Whole truth can we disclose
<b>Gm</b> <b>F</b> <b>Gm</b>
The soul of this sick bulwark forever and ever
<b>A7</b>
Forever and ever!
(Instrumental)
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b>
Eternal silence cries out for justice
<b>Dm/A</b> <b>Bb/F</b> <b>A7</b> <b>Bb/F</b> <b>A7</b> <b>Em</b>
Forgiveness is not for sale Nor is the will to forget
<b>Em</b> <b>C</b> <b>B7</b> <b>C</b> <b>B7</b>
You can't go on hiding yourself Behind
<b>Em</b> <b>C</b>
Old fashioned fairytales
<b>B7</b> <b>C</b> <b>B7</b> <b>Em</b>
And keep washing your hands in innocence</pre>
</div>
<div id="cifra2">
<h3>Epica - Storm The Sorrow</h3>
<pre>Intro 2x: <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
<b>Bm</b> <b>G</b> <b>Bm</b>
Along the way I find myself
<b>D</b> <b>D/C#</b>
To be confined within me
<b>Bm</b> <b>G</b> <b>D</b> <b>Em</b> <b>C</b>
No place for any other's mind to interfere,
<b>Bm</b>
To grasp the meaning of it all
<b>D</b> <b>D/C#</b>
To overcome my limits
<b>Bm</b> <b>D</b> <b>Em</b> <b>F#</b>
And dance away from any void and empty tones,
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Just tell me why
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Just tell me how I can survive this time
<b>Bm</b> <b>G</b> <b>Bm</b>
Believe yourself and look away
<b>D</b> <b>D/C#</b>
From all that's right within you
<b>Bm</b> <b>G</b> <b>D</b> <b>Em</b> <b>C</b>
Leave all your worries at the door and drift away,
<b>Bm</b> <b>G</b> <b>Bm</b>
I've tried to peer into the core
<b>D</b> <b>D/C#</b>
But could not storm the sorrow
<b>Bm</b> <b>D</b> <b>Em</b> <b>F#</b>
My hollow heart has bled me dry, left me to stray
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Another time without a trace,
<b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Condemn me now
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Send me to hell For I'm already failing
(refrão I)
<b>Em</b>
Intertwine the lines
<b>Bm</b>
That swim beneath the dark
<b>D</b>
Realize the pain we live in
<b>A</b>
Demonize the need we reel in, no
<b>Em</b> <b>Bm</b>
In my memories I'll dig deep enough to know
<b>D</b>
Centuries of dreams unending
<b>A</b> <b>Bm</b>
Another me that yielded tears when someone had betrayed
<b>Bm</b> (<b>G</b>) <b>Bm</b>
No time should ever go to waste
<b>D</b> <b>D/C#</b>
It's not that complicated
<b>Bm</b> <b>G</b> <b>D</b>
You're free to live your life at ease
<b>Em</b> <b>C</b>
No more restraints
<b>Bm</b> (<b>G</b>) <b>Bm</b>
No heed for shadows on your way
<b>D</b> <b>D/C#</b>
That try to steal your laughter
<b>Bm</b> <b>D</b> <b>Em</b>
Your light will drive them all away
<b>F#</b>
Be confident
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Will I refrain?
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Can I repent?
<b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Will you be there?
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Erase the page For I'm alone and ailing
(volta para refrão I)
<b>C</b>
<b>Bm</b> <b>C</b>
So, this is my life and it can't break me down
<b>Bm</b> <b>C</b>
Go, I will decide who can come in and heal my disease
<b>Bm</b>
Burn it in flames
<b>Bm</b>
Kill it and maim
<b>C</b>
Why can't you see that you need to be freed?
(refrão II - piano)
<b>Em</b> <b>Bm</b>
Intertwine the lines beneath the dark
<b>D</b>
Every bit of pain we're feeling
<b>A</b>
Every other solemn life, no
<b>Em</b> <b>Bm</b>
In the memories you will find somehow
<b>D</b>
There used to be a dream unending
<b>A</b>
No more need to be alone
(refrão III - sobe 1 tom)
<b>F#m</b>
Intertwine the lines
<b>C#m</b>
That swim beneath the dark
<b>E</b>
Realize the pain we live in
<b>B</b>
Demonize the need we reel in, no
<b>F#m</b> <b>C#m</b>
In my memories I'll dig deep enough to know
<b>E</b>
Centuries of dreams unending
<b>B</b> <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b>
Another me that yielded tears when someone had betrayed
<b>C#5</b> <b>E5</b> <b>F#5</b> <b>D5</b>
Someone had betrayed
(riff intro) <b>C#5</b> <b>E5</b> <b>D#5</b> <b>D5</b> <b>C#5</b></pre>
</div>Tip of the Day: Although jQuery sometimes seems much easier and more convenient, always use VanillaJS, or Pure JavaScript. With this you will really learn to program in the language and will not be "hostage" to a library.
You can use setInterval (continuous timer) that will increase page scrolling. Create 2 buttons (play / pause) that call the function that makes the move. In the play button I send a parameter to the function (triggering scrolling) and the pause button I do not send anything (stopping scrolling).
The value 50 in setInterval represents the speed - higher, slower value. In% w /% I increment% w /% of scrolling, that is, with each cycle of the timer, the page is rolled 2 pixels.
See how it works:
var tempo;
function rolar(e){
if(e){
var el = document.querySelector("#conteudo");
tempo = setInterval(function(){
var doc_scrl = document.documentElement.scrollTop;
if(el.offsetTop-doc_scrl <= window.innerHeight-el.offsetHeight){ // aqui é quando a janela chega ao fim
clearInterval(tempo);
}else{
window.scroll(0,doc_scrl+2);
}
}, 50);
}else{
clearInterval(tempo);
}
}#controls{
position: fixed;
top: 10px;
left: 10px;
}
#conteudo{
display: block;
width: 400px;
left: 100px;
position: relative;
}<div id="controls">
<button class="botao" onclick="rolar(1)">▶</button>
<button class="botao" onclick="rolar()">II</button>
</div>
<div id="conteudo">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed hendrerit scelerisque iaculis. Pellentesque luctus nisl et justo aliquet tincidunt. Etiam pharetra tristique mauris non sodales. Quisque mollis vel mauris a imperdiet. Duis sagittis posuere fringilla. Fusce pharetra ipsum lectus, vel malesuada felis consectetur a. Cras id lectus eget turpis porttitor euismod nec quis justo.
<p>Quisque a elit eget felis scelerisque vulputate. Morbi congue laoreet lorem, vitae aliquam tortor pretium eu. Integer vehicula tellus eget tellus tincidunt, ut scelerisque felis pellentesque. Aenean urna ligula, condimentum eu tortor ac, pharetra ullamcorper nibh. Pellentesque eget tristique velit. Proin purus enim, rhoncus nec justo eget, porttitor feugiat magna. Phasellus bibendum quam in leo viverra, eu mollis nisl feugiat. Duis porta sollicitudin accumsan. Phasellus quis nunc lacinia, rhoncus sem eu, placerat magna. Nulla et dignissim odio, et vestibulum enim. Morbi dapibus cursus efficitur. Quisque sagittis congue varius.</p>
<p>Nulla venenatis nec felis eu auctor. Nunc elementum magna et ligula accumsan condimentum. Pellentesque mollis risus a erat pretium hendrerit. Vestibulum ipsum nulla, laoreet ac maximus eu, consequat et erat. Vivamus sagittis vel sem non tincidunt. Duis orci dui, faucibus nec dolor ut, efficitur scelerisque elit. Nulla in vulputate nunc, quis ullamcorper neque. Suspendisse iaculis justo eu ante volutpat, vitae pretium lectus lobortis. Cras vitae diam mollis, fermentum nulla non, ultricies arcu. Vivamus ornare felis scelerisque ex porta tempor. In suscipit urna sit amet mi fringilla, at efficitur mi vestibulum.</p>
<p>Fusce eget odio lacinia, feugiat metus ut, imperdiet ligula. Duis sit amet elementum mauris. Nulla nibh quam, efficitur nec lorem ut, mattis finibus mauris. Donec vitae lectus neque. Fusce lacinia risus libero, sit amet faucibus orci ornare id. Donec vitae nisi ac odio hendrerit lobortis sed quis justo. Pellentesque laoreet turpis a nulla lobortis, id laoreet nisl consectetur. Cras eget fringilla libero, quis condimentum nisl. Donec suscipit metus ut nibh tristique vestibulum. Nulla id venenatis nunc. Praesent sodales quis velit vel aliquam. Morbi ut hendrerit magna, eu viverra lectus.</p>
<p>Duis non justo eget erat egestas finibus. Duis magna diam, laoreet ac scelerisque sit amet, euismod eu neque. Mauris vitae lacus arcu. Donec et dolor nec ex imperdiet dapibus at in quam. Mauris ac ornare risus, non posuere est. Mauris lorem sem, gravida quis sapien eget, blandit sagittis velit. Donec et sollicitudin nibh, ut gravida felis. Morbi maximus metus tellus, nec consectetur ipsum tristique vel. Phasellus vehicula magna quis erat posuere interdum. Curabitur laoreet est at scelerisque malesuada. Mauris sodales tellus vel congue aliquam. Donec eu accumsan sem.</p>
</div>