タグ

Webデザインとajaxに関するtuffgong57のブックマーク (2)

  • データの追記読み込みに対応するテーブル·StreamTable.js MOONGIFT

    StreamTable.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。 業務システムなどではデータの表示の際にテーブル組で表示する事が多々あります。そのような時に一気に表示しようとするとレンダリングに時間がかかります。そこで使ってみたいのがデータを取得しながら表示を行っていくStreamTable.jsです。 テーブルは既に表示されていますが、データは徐々に取得されていきます。例えばこの場合は20%までデータを取っています。 ページネーションもどんどん増えていきます。 検索ボックスを使って予めフィルタリングする事もできます。マッチするデータだけが追加されていきます。 仕組みとしてはAjaxでデータを取得しています。 StreamTable.jsではデータのストリームベースでの取得に加えて、検索によるデータ絞り込みとページネーションに対応しています

    データの追記読み込みに対応するテーブル·StreamTable.js MOONGIFT
  • [JS]レスポンシブデザインもOK、水平タイプのナビゲーションをいい感じにするスクリプト -HorizontalNav

    リスト要素で実装した水平タイプのナビゲーションのスタイルを壊すことなく、配置エリア・表示サイズに合わせて最適化するjQueryのプラグインを紹介します。 HorizontalNav [ad#ad-2] HorizontalNavのデモ HorizontalNavの使い方 HorizontalNavのデモ 水平タイプのナビゲーションの見た目は通常、成り行きや指定したサイズになりますが、HorizontalNavを使用すると配置エリアのサイズに合わせて各アイテムのサイズを均等にします。 デモ:480pxで表示 上:未適用はが成り行きで二段になってしまう幅になっても、下:適用の見た目は損なわれません。 HorizontalNavの使い方 実装は4ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script src="//aja

  • 1