タグ

webデザインとjavascriptに関するyu3ho7のブックマーク (3)

  • Tabulator - これはすごい。HTMLテーブルを高機能に MOONGIFT

    テーブル表示はWebシステムのデファクトとも言えます。業務システムはいうに及ばず、管理者画面などでも必ず求められる表示です。そしてただ表示すればいいという訳ではなく、ソートやフィルタリング、インラインでの編集など様々な機能が求められるものです。 そんな多機能なテーブル表示を実現してくれるのがTabulatorです。多くのニーズを満たしてくれることでしょう。 Tabulatorの使い方 てんこ盛りなデモテーブル。ざっと見てもフィルタ、ページネーション、グラフ表示、ソートなどの機能が確認できます。 インライン編集もサポートされています。 データに合わせて幅を自動調整。 行をクリックして展開する機能。 カラムをグループ化。 カラムを縦に。これはカラムが多い時に便利そうです。 ドリルダウン。 テーブルを入れ子にもできます。 スパークライン表示。 フッターで集計。 HTMLテーブルを変換する機能もあ

    Tabulator - これはすごい。HTMLテーブルを高機能に MOONGIFT
  • コード不要で手描き風のSVGアニメーションを自動作成できるエディタ「Vivus Instant」の使い方大公開! - paiza times

    どうも、まさとらん(@0310lan)です! 今回は、誰でも超簡単にSVG画像をアニメーション化できる無料のWebサービスをご紹介します! このサービスは、JavaScriptSVG画像を制御できる「vivus.js」をベースにしており、誰でもプログラミング不要で簡単に「手描き風」のアニメーションを作れるのが特徴です。 【 Vivus Instant 】 そして記事の後半では「vivus.js」を使った基的なプログラミングについても解説しているので、ご興味ある方はぜひ参考にしてみてください! ■「Vivus Instant」とは? それでは、実際に「Vivus Instant」を使いながら、どのようなサービスなのかを見ていきましょう! まずは、サンプルとして次のようなSVG画像を用意しました。 SVGは、ベクター形式で描かれたXML構造を持つデータですが、このままでは当然ながら静止画

    コード不要で手描き風のSVGアニメーションを自動作成できるエディタ「Vivus Instant」の使い方大公開! - paiza times
  • [JS]ナビゲーション画像にアニメーションのエフェクトをつける -CSS Sprite2

    A List Apartのエントリーから、CSS Spriteを使用したナビゲーションに、マウスオーバー時にアニメーションのエフェクトをつける「CSS Sprite2」を紹介します。 CSS Sprites2 - It's JavaScript Time demo 5 demo 6 CSS Spriteとは、スタイルシートで一枚の画像から複数箇所に配置をしたり、マウスオーバー時の画像指定を行うものです。 CSS Sprite2は、そのCSS Spriteにスクリプトを使用して、アニメーションのエフェクトつけたものです。 使用するスクリプトは、デモではjQueryが使用されていますが、PrototypeでもYUIなど他のスクリプトでも実装は可能です。 CSS Sprite2のベースとなっているのは、下記ページとのことです。

  • 1