laozt
1 year ago
parent
d59cd051ee
commit
3795d3e8cd
@ -1,147 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div id="editor-wrapper">
|
|
||||||
<div id="toolbar-container">
|
|
||||||
<button class="ql-bold"></button>
|
|
||||||
<button class="ql-italic"></button>
|
|
||||||
<button class="ql-underline"></button>
|
|
||||||
<button class="ql-link"></button>
|
|
||||||
</div>
|
|
||||||
<div id="scrolling-container">
|
|
||||||
<div id="quill-container">
|
|
||||||
<h2>Description</h2>
|
|
||||||
<p>
|
|
||||||
This example shows how setting the scrollingContainer to html, it no
|
|
||||||
longer jumps UP when saving a link, but it will jump DOWN on many
|
|
||||||
different interactions, such as scrolling below the header and
|
|
||||||
pressing enter multiple times.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<br />
|
|
||||||
</p>
|
|
||||||
<h2>Instructions</h2>
|
|
||||||
<p><br /></p>
|
|
||||||
<ul>
|
|
||||||
<li>Scroll down to the "Scroll down below this header" header</li>
|
|
||||||
<li>Press enter multiple times</li>
|
|
||||||
<li>
|
|
||||||
The scrollbar will jump down further and further with each press
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<p><br /></p>
|
|
||||||
<h2>Keep scrolling down</h2>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
There had been the first ride at terrible speed without a halt, and
|
|
||||||
then in the dawn he had seen a pale gleam of gold, and they had come
|
|
||||||
to the silent town and the great empty house on the hill. And hardly
|
|
||||||
had they reached its shelter when the winged shadow had passed over
|
|
||||||
once again, and men wilted with fear. But Gandalf had spoken soft
|
|
||||||
words to him, and he had slept in a corner, tired but uneasy, dimly
|
|
||||||
aware of comings and goings and of men talking and Gandalf giving
|
|
||||||
orders. And then again riding, riding in the night. This was the
|
|
||||||
second, no, the third night since he had looked in the Stone. And
|
|
||||||
with that hideous memory he woke fully, and shivered, and the noise
|
|
||||||
of the wind became filled with menacing voices.
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
A light kindled in the sky, a blaze of yellow fire behind dark
|
|
||||||
barriers Pippin cowered back, afraid for a moment, wondering into
|
|
||||||
what dreadful country Gandalf was bearing him. He rubbed his eyes,
|
|
||||||
and then he saw that it was the moon rising above the eastern
|
|
||||||
shadows, now almost at the full. So the night was not yet old and
|
|
||||||
for hours the dark journey would go on. He stirred and spoke.
|
|
||||||
</p>
|
|
||||||
<h2>Scroll down below this header</h2>
|
|
||||||
<p>"Where are we, Gandalf?" he asked.</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
"In the realm of Gondor," the wizard answered. "The land of Anórien
|
|
||||||
is still passing by."
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
There was a silence again for a while. Then, "What is that?" cried
|
|
||||||
Pippin suddenly, clutching at Gandalf"s cloak. "Look! Fire, red
|
|
||||||
fire! Are there dragons in this land? Look, there is another!"
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
For answer Gandalf cried aloud to his horse. "On, Shadowfax! We must
|
|
||||||
hasten. Time is short. See! The beacons of Gondor are alight,
|
|
||||||
calling for aid. War is kindled. See, there is the fire on Amon Dîn,
|
|
||||||
and flame on Eilenach; and there they go speeding west: Nardol,
|
|
||||||
Erelas, Min-Rimmon, Calenhad, and the Halifirien on the borders of
|
|
||||||
Rohan."
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
But Shadowfax paused in his stride, slowing to a walk, and then he
|
|
||||||
lifted up his head and neighed. And out of the darkness the
|
|
||||||
answering neigh of other horses came; and presently the thudding of
|
|
||||||
hoofs was heard, and three riders swept up and passed like flying
|
|
||||||
ghosts in the moon and vanished into the West. Then Shadowfax
|
|
||||||
gathered himself together and sprang away, and the night flowed over
|
|
||||||
him like a roaring wind.
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
Pippin became drowsy again and paid little attention to Gandalf
|
|
||||||
telling him of the customs of Gondor, and how the Lord of the City
|
|
||||||
had beacons built on the tops of outlying hills along both borders
|
|
||||||
of the great range, and maintained posts at these points where fresh
|
|
||||||
horses were always in readiness to bear his errand-riders to Rohan
|
|
||||||
in the North, or to Belfalas in the South. "It is long since the
|
|
||||||
beacons of the North were lit," he said; "and in the ancient days of
|
|
||||||
Gondor they were not needed, for they had the Seven Stones." Pippin
|
|
||||||
stirred uneasily.
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
"Sleep again, and do not be afraid!" said Gandalf. "For you are not
|
|
||||||
going like Frodo to Mordor, but to Minas Tirith, and there you will
|
|
||||||
be as safe as you can be anywhere in these days. If Gondor falls, or
|
|
||||||
the Ring is taken, then the Shire will be no refuge."
|
|
||||||
</p>
|
|
||||||
<p><br /></p>
|
|
||||||
<p>
|
|
||||||
"You do not comfort me," said Pippin, but nonetheless sleep crept
|
|
||||||
over him. The last thing that he remembered before he fell into deep
|
|
||||||
dream was a glimpse of high white peaks, glimmering like floating
|
|
||||||
isles above the clouds as they caught the light of the westering
|
|
||||||
moon. He wondered where Frodo was, and if he was already in Mordor,
|
|
||||||
or if he was dead; and he did not know that Frodo from far away
|
|
||||||
looked on that same moon as it set beyond Gondor ere the coming of
|
|
||||||
the day.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import Quill from "quill";
|
|
||||||
// import "quill/dist/quill.core.css";
|
|
||||||
import "quill/dist/quill.snow.css";
|
|
||||||
import "quill/dist/quill.bubble.css";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {};
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
var quill = new Quill("#quill-container", {
|
|
||||||
modules: {
|
|
||||||
toolbar: "#toolbar-container",
|
|
||||||
},
|
|
||||||
scrollingContainer: "html",
|
|
||||||
placeholder: "Compose an epic...",
|
|
||||||
theme: "snow",
|
|
||||||
});
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
|
||||||
Loading…
Reference in new issue