PC版のオンラインカウンターを動く麻雀牌にしたのが去年の春ごろ。

その後少し改良して、牌をクリックすると咲-Saki-キャラのセリフがポップアップするようにしました。
pai-said
ただこのセリフのセットを、アニメーション切り替えと同時にしていたので、
 一つの動作が終わるまでセリフが変らない
 →ゆっくり動いている牌は何度クリックしても同じセリフが表示され、あまり面白くない
ということが前から気になっていたので、クリックのタイミングで切り替わるように再改良しました。

たくさんクリックして遊んでくれるとうれしいなって…

以下は技術的なアレなので、興味のある方だけ御覧下さい。

JavaScript

セリフの配列

var words ='いっしょに楽しもうよ!!,(略),なんでスーツで谷間出してるの<br>この人…'.split(',');
セリフを「,」でつなげてひとつの長い文字列にし、split()で分解、配列に変換します。
最初から配列として定義するより楽なので、こういう書き方をしました。

イベントリスナー

$("#visitors").on("click", ".ancoro", function(e) {
カウンターの表示枠visitorsに含まれるancoroというクラスの要素=麻雀牌がクリックされた時の処理を定義するイベントリスナーです。
カウンターの麻雀牌はもとのHTMLには存在せず、あとから生成している要素なので、click()ではなくon()メソッドの方を使います。
	var serif = words[Math.floor(Math.random() * words.length)],
		balloon = $('<div class="pai-said">' + serif + "</div>");
セリフの配列wordsからランダムに一つのセリフを選び、フキダシ要素baloonを作ります。
	e || (e = event);
	var x = e.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft),
		y = e.clientY + (document.body.scrollTop || document.documentElement.scrollTop);
	balloon.css({
		left: x + 20 + "px",
		top: y - 30 + "px"
	}), 
クリックされた座標からフキダシを表示する座標を算出し、baloonのCSSプロパティにセットします。
	$(document.body).append(balloon), 
	balloon.fadeIn("fast").delay(600).fadeOut("fast", function() {
		balloon.remove();
	});
});
baloonbody要素に挿入し、0.6秒表示してから削除します。

おまけ フキダシのCSS

.pai-said {
	position: absolute;
	background: ivory;
	font-size: 12px;
	font-weight: 700;
	color: #877;
	padding: 10px;
	border: 1px solid silver;
	border-radius: 10px 10px;
	z-index: 99;
	max-width: 200px;
	box-sizing: border-box
}
.pai-said::before {
	border-width: 4px 10px 4px 0;
	border-color: transparent silver;
	border-style: solid;
	display: block;
	position: absolute;
	bottom: 6px;
	left: -10px;
	width: 0;
	height: 0;
	content: '';
}
.pai-said::after {
	border-width: 4px 10px 4px 0;
	border-color: transparent ivory;
	border-style: solid;
	display: block;
	position: absolute;
	bottom: 6px;
	left: -9px;
	width: 0;
	height: 0;
	content: '';
}
pai-saidはフキダシ本体、pai-said::beforeはフキダシの尻尾の輪郭、pai-said::afterは尻尾の塗りです。
見た目は単純なのに、裏技を複雑に駆使した、結構難易度の高いCSSです。
ジェネレータサイトもありますが、仕組みから理解したい方は、こちらが参考になると思います。
CSSで吹き出しを作ろう (全8回) - プログラミングならドットインストール