「タイピングしてる」っぽいテキストエフェクトを作る
Result
jQuery
$("#type").each(function() {
var $this = $(this);
var str = $this.text();
$this.empty().show();
str = str.split("");
str.push("|");
// 待機時間
var delay = 100;
$.each(str, function(i, val) {
if (val == "^") {
// ^を書くと待機する
}
else {
$this.append('<span>' + val + '</span>');
$this.children("span").hide().fadeIn(100).delay(delay * i);
}
});
$this.children("span:last").css("textDecoration", "blink");
});
html
<p id="type">こんにちは!^^^^かちびと.netです。^^^^^^^^^^ 管理者はおじさんです</p>
via
ghosttype