https://github.com/Joecool48/JS-syntax-highlighting-typewriter

A JS file for html pages that will auto syntax highlight, and display with a typewriter animation
https://github.com/Joecool48/JS-syntax-highlighting-typewriter

animation automatic javascript simple syntax-highlighting typewriter web

Last synced: about 1 month ago
JSON representation

A JS file for html pages that will auto syntax highlight, and display with a typewriter animation

• Host: GitHub
• URL: https://github.com/Joecool48/JS-syntax-highlighting-typewriter
• Owner: Joecool48
• Created: 2018-01-17T20:03:23.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2018-09-01T22:05:57.000Z (over 6 years ago)
• Last Synced: 2024-08-05T10:20:57.223Z (5 months ago)
• Topics: animation, automatic, javascript, simple, syntax-highlighting, typewriter, web
• Language: JavaScript
• Size: 11.7 KB
• Stars: 8
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# JS-syntax-highlighting-typewriter

A JS file for html pages that will auto syntax highlight, and display with a typewriter animation

Put  at the bottom of your html document.

To setup the effect simply call the function setupTypewriter with the HTML document object as a argument.

This is where the text will be displayed.

Setup the typewriter to output to the typewriter element:

```javascript

var typewriter = setupTypewriter(document.getElementById("typewriter"));

```

Add the input to the typewriter:

```javascript

typewriter.parseHtml(document.getElementById("typewriter"));

```

Set the typewriter speed (Higher numbers are slower):

```javascript

typewriter.setTypeSpeed(300);

```

Sets whether the element where the text is being printed should auto scroll to the bottom:

```javascript

typewriter.scrollLock(true);

```

Simply clears the screen of all the text:

```javascript

typewriter.clearScreen();

```

Actually starts the typing. To stop, simply call stop.

```javascript

typewriter.type();

```

To change the colors and things that are highlighted, go to the top of the JS file and modify the strings containing the colors, or the

array of strings with the keywords.