|
|
<!doctype html>
<title>CodeMirror: Simple Scrollbar Demo</title><meta charset="utf-8"/><link rel=stylesheet href="../doc/docs.css">
<link rel="stylesheet" href="../lib/codemirror.css"><link rel="stylesheet" href="../addon/scroll/simplescrollbars.css"><script src="../lib/codemirror.js"></script><script src="../mode/markdown/markdown.js"></script><script src="../mode/xml/xml.js"></script><script src="../addon/scroll/simplescrollbars.js"></script>
<div id=nav> <a href="https://codemirror.net/5"><h1>CodeMirror</h1><img id=logo src="../doc/logo.png"></a>
<ul> <li><a href="../index.html">Home</a> <li><a href="../doc/manual.html">Manual</a> <li><a href="https://github.com/codemirror/codemirror5">Code</a> </ul> <ul> <li><a class=active href="#">Simple Scrollbar</a> </ul></div>
<article><h2>Simple Scrollbar Demo</h2><form><textarea id="code" name="code"># Custom Scrollbars
This is a piece of text that creates scrollbars
Lorem ipsum dolor sit amet, turpis nec facilisis neque vestibulum adipiscing, magna nunc est luctus orci a,aliquam duis ad volutpat nostra. Vestibulum ultricies suspendisse commodo volutpat pede sed. Bibendum odiodignissim, ad vitae mollis ac sed nibh quis, suspendisse diam, risus quas blandit phasellus luctus nec,integer nunc vitae posuere scelerisque. Lobortis quam porta conubia nulla. Et nisl ac, imperdiet vitae ac.Parturient sit. Et vestibulum euismod, rutrum nunc libero mauris purus convallis. Cum id adipiscing et egetpretium rutrum, ultrices sapien magnis fringilla sit lorem, eu vitae scelerisque ipsum aliquet, magna sedfusce vel.
Lectus ultricies libero dolor convallis, sed etiam vel hendrerit egestas viverra, at urna mauris, egetvulputate dolor voluptatem, nulla eget sollicitudin. Sed tincidunt, elit sociis. Mattis mi tortor dui idsodales mi, maecenas nam fringilla risus turpis mauris praesent, imperdiet maecenas ultrices nonummy tellusquis est. Scelerisque nec pharetra quis varius fringilla. Varius vestibulum non dictum pharetra, tincidunt investibulum iaculis molestie, id condimentum blandit elit urna magna pulvinar, quam suspendisse pellentesquedonec. Vel amet ad ac. Nec aut viverra, morbi mi neque massa, turpis enim proin. Tellus eu, fermentum velitest convallis aliquam velit, rutrum in diam lacus, praesent tempor pellentesque dictum semper augue. Felisexplicabo massa amet lectus phasellus dolor. Ut lorem quis arcu neque felis ultricies, senectus vitaecurabitur sed pellentesque et, id sed risus in sed ac accumsan, blandit arcu quam duis nunc.
Sed leo sollicitudin odio vitae, purus sit egestas, justo eros inceptos auctor fermentum lectus. Ligula luctusturpis, quod massa vitae elementum orci, nullam fringilla elit tortor. Justo ante tempor amet quam posuerevolutpat. Facilisis pede erat ut hac ultrices ipsum, wisi duis sit metus. Dolor vitae est sed sed vitae. Sedeu ligula, morbi vestibulum nunc nibh velit ut taciti, ligula elit semper sagittis in, auctor arcu vel eget.Mauris at vitae nec suspendisse et, aenean proin blandit suscipit. Morbi quam, dolor ultricies. Viverratempus. Suspendisse sit dapibus, ac fuga aenean, magna nisl nonummy augue posuere, dictum ut fuga velitparturient augue interdum, mattis sit tellus.
Vehicula commodo tempus curabitur eros, lacinia erat vulputate lorem vel fermentum donec, lectus sed conubiaid pellentesque. Vel senectus donec pede aliquet dolor sit, nec vivamus justo placerat interdum maecenas,sodales euismod. Quis netus sapien amet, vestibulum quam nec amet lacinia, quis aliquet, tempor vivamus tellusenim, suscipit quis eleifend. Amet class phasellus orci pretium, risus in nulla. Neque sit ullamcorper,ultricies platea id nec suspendisse ac. Et elementum. Dictum nam, ut dui fermentum egestas facilisis elitaugue, adipiscing donec ipsum erat nam pellentesque convallis, vestibulum vestibulum risus id nulla ut mauris,curabitur aute aptent. Ultrices orci wisi dui ipsum praesent, pharetra felis eu quis. Est fringilla etiam,maxime sem dapibus et eget, mi enim dignissim nec pretium, augue vehicula, volutpat proin. Et occaecatilobortis viverra, cum in sed, vivamus tellus. Libero at malesuada est vivamus leo tortor.</textarea></form>
<p>The <a href="../doc/manual.html#addon_simplescrollbars"><code>simplescrollbars</code></a> addon defines twostyles of non-native scrollbars: <a href="javascript:editor.setOption('scrollbarStyle', 'simple')"><code>"simple"</code></a> and <a href="javascript:editor.setOption('scrollbarStyle', 'overlay')"><code>"overlay"</code></a> (click to try), which can be passed tothe <a href="../doc/manual.html#option_scrollbarStyle"><code>scrollbarStyle</code></a> option. These implementthe scrollbar using DOM elements, allowing more control overits <a href="../addon/scroll/simplescrollbars.css">appearance</a>.</p>
<script> var editor = CodeMirror.fromTextArea(document.getElementById("code"), { lineNumbers: true, scrollbarStyle: "simple" }); </script></article>
|
