Laquu.jsが面白い

jQueryが初心者なんでこういうのあると助かる。

Laquu.jsとは？
Laquu.jsは普段からのHTMLコーディング作業量を極力減らすためのjQuery プラグインです。
プラグインが散乱することを防ぎ、1ファイルで完結することで、後の管理を極力低減させます。
laquu.jsを使う事で、きっと「楽に作業を軽減」することができるはずです。
http://laquu.com/

使い方

　サイトにある通り、こんな感じでいいです

<script type="text/javascript" src="/path/to/jquery.laquu.js"></script>

Toast

　今回使ったのはToastの機能。これはAndroidとかでメッセージが画面にフワって表示されてフェードアウトして消えていく機能。これで画面中央にメッセージが表示されて消える。本家のサンプルは[こちら]

jQuery("#show_toast").bind("click", function(){
    laquu.Toast.show({
        message: "トーストメッセージです。"
    });
});

画面上に追加されるエレメント

<div class="laquu-toast-container">
	<p class="laquu-toast-message">
		ここにメッセージ
	</p>
</div>"

　これの注意点は、メッセージのスタイルについては、自前でlaquu-toast-messageというクラスを定義してあげる必要があること。laquu-toast-containerについてはToastメッセージの場所とかをJS側で自動的につけるものなので、いじらないほうがよいかな

追記：2013-03-20

　よくよくサイトのソース読んでると、plugins.cssってスタイルシートが定義してあって、それを読むようにするとデフォルトのスタイルが定義されているみたい。本家でダウンロードできないってことはこれを参考にして作ってね！ってことなのかな？ちなみにToastのスタイルは次

.laquu-toast-container {
    padding: 15px 10px;
    border: 3px solid #CCC;
    background: #666;
    background: rgba(60, 60, 60, .75);
    width: 280px;
    text-align: center;
}

.laquu-toast-message {
    color: #FFF;
}

arcanum_jp’s blog

おっさんの日記

使い方

Toast