MottoJS, a JS plug-in that makes your motto more fun.

  javascript

Project address:https://github.com/jrainlau/m …
Experience address:https://jrainlau.github.io/mo …
Codepen:Codepen

Latest update: Version 1.0.1 has added “Jitter Effect”, similar to the appearance of signal interference, welcome to taste ~

Tanabata is coming, I won’t tell you this is a confession artifact … Write a long confession letter, putconfigSet the time inside longer, and then silently send it to your sweetheart …

Introduction

MottoJSJS plug-in is a 4kb(.min file is only 2kb) js plug-in, green and independent. viaMottoJSYou can show your motto in a cool way.
图片描述

Installation

npm

npm install motto

or

git clone git@github.com:jrainlau/motto.git

Use

Write an html tag, such as<h1></h1>Or other

<h1 class="motto"></h1>

Then introduceMottoJS

<script src="motto.min.js"></script>

MottoJSAt the same time support toAMD,CommonJSOrES2015In the past few years.

Then usenewOperator to generate a MottoJS instance

var motto = new Motto(el, config)

Parameter

MottoJSAccept two parameters.

  • el {String / HTML element}Must
    Use the CSS selector to select an html element to display your motto.

  • config {Object}Must
    An object with 5 attributes for configuring MottoJS.

Configuration

The basic configuration objects are as follows:

{
 lyric: 'To be or not to be, that\'s a question.',
 showUpSpeed: 1000,
 flashSpeed: 100,
 flashTimeout: 1000,
 callback: function() { ... }
 }

  • lyric {String}Optional Default value:''
    The content of your motto.

  • showUpSpeed {Number}Optional Default value: 0
    Your motto will appear word by word. This option is used to set the interval between them.

  • flashSpeed {Number}Optional Default value: 0
    Control when your motto changes from garbled to meaningful sentences.

  • flashTimeout {Number}Optional Default value: 0
    Sets the transition time from the complete output of the motto to the garbled conversion.

  • callback {Function}Optional Default: {}
    Callback function after garbled conversion.

Certificate

MIT

Thank you for reading. I am Jrain, welcome to pay attention.My column, will not regularly share their learning experience, development experience, carrying dry goods outside the wall. See you next time!