JSFiddle - React, Tailwind, and code Playground
HTML
<h3>ログインフォームっぽいやつ</h3>
<div class="row">
<input id="inp1" type="text" value="" placeholder="メールアドレス" autocomplete="off">
</div>
<div class="row">
<input style="display:none">
<input id="inp2" type="password" value="" placeholder="パスワード" autocomplete="off">
<p> script by <a href="http://kushagragour.in/lab/superplaceholderjs/">Kushagra Gour</a></p>
</div>
JavaScript
/*! superplaceholder.js - v0.1.0 - 2016-02-29
* http://kushagragour.in/lab/superplaceholderjs/
* Copyright (c) 2016 Kushagra Gour; Licensed CC-BY-ND-4.0 */
! function() {
function a(a, b) {
var c = {};
for (var d in a) c[d] = void 0 === b[d] ? a[d] : b[d];
return c
}
function b(b, c, d) {
this.el = b, this.texts = c, d = d || {}, this.options = a(e, d), this.timeouts = [], this.begin()
}
var c = document.createElement("input"),
d = "placeholder" in c,
e = {
letterDelay: 100,
sentenceDelay: 1e3,
loop: !1,
startOnFocus: !0
};
b.prototype.begin = function() {
var a = this;
a.originalPlaceholder = a.el.getAttribute("placeholder"), a.options.startOnFocus ? (a.el.addEventListener("focus", function() {
a.processText(0)
}), a.el.addEventListener("blur", function() {
a.cleanUp()
})) : a.processText(0)
}, b.prototype.cleanUp = function() {
for (var a = this.timeouts.length; a--;) clearTimeout(this.timeouts[a]);
this.el.setAttribute("placeholder", this.originalPlaceholder), this.timeouts.length = 0
}, b.prototype.typeString = function(a, b) {
function c(c) {
e.el.setAttribute("placeholder", a.substr(0, c + 1) + (c === a.length - 1 ? "" : "|")), c === a.length - 1 && b()
}
var d, e = this;
if (!a) return !1;
for (var f = 0; f < a.length; f++) d = setTimeout(c, f * e.options.letterDelay, f), e.timeouts.push(d)
}, b.prototype.processText = function(a) {
var b, c = this;
c.typeString(c.texts[a], function() {
b = setTimeout(function() {
c.processText(c.options.loop ? (a + 1) % c.texts.length : a + 1)
}, c.options.sentenceDelay), c.timeouts.push(b)
})
};
var f = function(a) {
d && new b(a.el, a.sentences, a.options)
};
"object" ==...