ahmeterenodaci / AEO-TypeWriter

AEO Typewriter is a jQuery plugin for "typewriter" effect.

AEO-TypeWriter

AEO Typewriter is a jQuery plugin for "typewriter" effect.
Demo

Usage

Include jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Include plugin's Js and Css:

<script src="js/aeo-typewriter.js"></script>
<link rel="stylesheet" href="css/aeo-style.css">

You can also use this for a quick start

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://ahmeterenodaci.github.io/AEO-TypeWriter/js/aeo-typewriter.js"></script>
<link rel="stylesheet" href="https://ahmeterenodaci.github.io/AEO-TypeWriter/css/aeo-style.css">

Example 1 (with tw-text attribute)

<div id="example1" tw-text="Hello World!"></div>
<script>
  $("#example1").typewriter();
</script>

Example 2 (with tw-text attribute)

<div id="example2" tw-text="Hello World!"></div>
<script>
  $("#example2").typewriter({
      waitingTime: 1000,
      delay: 150,
      hide: 1500,
      cursor: true,
  });
</script>

Example 3 (without tw-text attribute)

<div id="example3"></div>
<script>
  $("#example3").typewriter({
      text: "Hello World!",
      waitingTime: 1000,
      delay: 150,
      hide: 1500,
      cursor: true,
  });
</script>

Options

Options	Type	Description	Default
text	String	The text that appears with typewriter effect	tw-text attribute
delay	int	Delay time between each letter	150
waitingTime	int	The time in miliseconds before start	1000
cursor	Boolean	Do you want cursor?	false
hide	int	The time in miliseconds before hiding	0 (Don't hide)

Hey!

New idea or improvement? Something not working right? Open an Issue.