User:Book: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 16: | Line 16: | ||
===Hello World--web page with glider in viewer=== | ===Hello World--web page with glider in viewer=== | ||
A simple web page with a glider in a LifeViewer | *A simple web page with a glider in a LifeViewer | ||
*Paste this in your text editor, save it and run it | |||
<pre> | <pre> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
| Line 27: | Line 28: | ||
<!--viewer container--> | <!--viewer container--> | ||
<div class="viewer"> <!--class=viewer is required--> | <div class="viewer"> <!--class=viewer is required--> | ||
<textarea>bo$2bo$3o!</textarea><br/> <!--textarea required in viewer container--> | <textarea>bo$2bo$3o!</textarea><br/> <!--textarea required in viewer container--> | ||
<canvas></ | <canvas></canvas> <!--canvas required in viewer container--> | ||
</div> | |||
<!--end viewer container--> | |||
</body> | |||
</html> | |||
</pre> | |||
===Add some style=== | |||
*A simple web page with a glider in a LifeViewer | |||
*Paste this in your text editor, save it and run it | |||
<pre> | |||
<!DOCTYPE html> | |||
<html> | |||
<head> | |||
<meta name="LifeViewer" content="viewer textarea"> <!--required tag--> | |||
<script src="lv-plugin.js"></script> <!--assumes plug-in is in the same directory as html file--> | |||
<style> | |||
body{ | |||
margin:50px; | |||
} | |||
.lv-rle{ | |||
font:12pt arial; | |||
resize:none; | |||
width:594px; | |||
min-height:120px; | |||
max-height:120px; | |||
} | |||
</style> | |||
</head> | |||
<body> | |||
<!--viewer container--> | |||
<div class="viewer"> | |||
<textarea class="lv-rle">bo$2bo$3o!</textarea><br/> <!--added classname--> | |||
<canvas height=400 width=600></canvas> <!--added with and height attributes for viewer--> | |||
</div> | </div> | ||
<!--end viewer container--> | <!--end viewer container--> | ||
Revision as of 18:43, 18 November 2021
| Lifespan 4700 (click above to open LifeViewer) |
Under Construction
This is my sandbox.
Getting started
Download the LifeViewer plug-in
- Use this link: download
- The javascript code will be displayed in your browser
- Do a "Save" or "Save as..." and save lv-plugin.js where you want it
- In this tutorial, we assume the plug-in is in the same folder as your html file
Hello World--web page with glider in viewer
- A simple web page with a glider in a LifeViewer
- Paste this in your text editor, save it and run it
<!DOCTYPE html> <html> <head> <meta name="LifeViewer" content="viewer textarea"> <!--required tag--> <script src="lv-plugin.js"></script> <!--assumes plug-in is in the same directory as html file--> </head> <body> <!--viewer container--> <div class="viewer"> <!--class=viewer is required--> <textarea>bo$2bo$3o!</textarea><br/> <!--textarea required in viewer container--> <canvas></canvas> <!--canvas required in viewer container--> </div> <!--end viewer container--> </body> </html>
Add some style
- A simple web page with a glider in a LifeViewer
- Paste this in your text editor, save it and run it
<!DOCTYPE html>
<html>
<head>
<meta name="LifeViewer" content="viewer textarea"> <!--required tag-->
<script src="lv-plugin.js"></script> <!--assumes plug-in is in the same directory as html file-->
<style>
body{
margin:50px;
}
.lv-rle{
font:12pt arial;
resize:none;
width:594px;
min-height:120px;
max-height:120px;
}
</style>
</head>
<body>
<!--viewer container-->
<div class="viewer">
<textarea class="lv-rle">bo$2bo$3o!</textarea><br/> <!--added classname-->
<canvas height=400 width=600></canvas> <!--added with and height attributes for viewer-->
</div>
<!--end viewer container-->
</body>
</html>