You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
前回の表示件数の変更に続いて、ページネーションの追加方法です。ページネーションができると見たいデータだけを絞り込んで表示できます。 実際に動いているデモはこちらにあります。動かしているところは下記の画像になります。 HTMLにページネーション情報を追加する まずHTMLにページを移動するボタンと現在、トータルのページ数を表示するHTMLを追加します。 This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirecti
電子書籍コンテンツはここ数年で一気に増えています。Eコマースサイトで販売されるものだけでなく、スマートフォンアプリでも提供されています。さらにコンテンツさえ作れば業務システムのヘルプなどで提供するのも良いでしょう。 今回はそんな電子書籍風のUIを実現できるJavaScriptライブラリを紹介します。 Laker compendium 動画を埋め込んだり、タップアクションなどのイベントも使えるので、かなりインタラクティブな電子書籍が作成できます。単なる書籍の置き換えではなく、電子書籍ならではの価値が提供できそうです。 Laker compendium – Designing digital publications in HTML5 Turn.js ページをめくったり、拡大/縮小する機能が備わっています。ページの形もカスタマイズできるので、書籍風以外でも使えるようになっています。 blast
大量のデータを表示する際に要望に上がってくるのがデータの表示件数を変更する機能です。ページネーションと組み合わせて使いますが、今回はまずデータ件数の変更について紹介します。 実際に動いているデモはこちらにあります。また、動いている画像は下記になります。 データの表示件数を指定する まずHTML側でデータの表示件数を指定できるようにします。今回は次のようなドロップダウンを用意しました。 This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn mor
はじめに(SPAについて) 昨今注目の技術にSPAという技術があります。SPAとはSingle-Page-Applicationの頭文字です。SPAの利点は、ユーザがアプリケーションを使っている間、Webページ全体をリロードする必要がないためレスポンスが高速ということです。RIA(Rich Internet Application)に変わる技術として注目を集めています。 代表的なJavaScriptのライブラリにAngular.jsや、Backbone.jsなどがありますが、今回はSPA専用のJavaScriptライブラリとして以下の5つを紹介します。 Senna.js pager.js sonnyJS RomanSPA durandaljs Senna.js Senna.jsの読み方はセナあるいはセンナです。こちらのサイトによると、F1レーサーではなく、下剤に使われる漢方薬の元の植物の名
業務システムでは一覧表がよく使われます。多くはテーブルタグを使って実現しますが、使っている内により細かな機能が望まれるようになります。例えば表をソートしたり、インラインで編集するような機能です。 今回はそんなユーザニーズに応えられる高機能な表計算ライブラリを紹介します。 Handsontable Community Edition セルをマージしたり枠の色を変更する、選択行のハイライトなどとても多機能です。ヘッダーや左列の固定もサポートしています。コミュニティエディションはMIT Licenseですが、有償版も用意されています。 handsontable/handsontable: Handsontable Community Edition – a JavaScript/HTML5 Spreadsheet Library for Developers SlickGrid ヘッダーを固定し
hifiveのチャートライブラリの使い方を紹介します。今回はグラフの拡大表示、縮小表示の仕方です。 ベースはチャートライブラリの使い方(1)「基本編」 | hifive開発者ブログのグラフになります。 実行しているところは下記の通りです。こちらのURLにてサンプルを試せます。 幅と高さをコントローラの変数へ移行 チャートの幅と高さを動的に変更するので、設定をコントローラの変数にします。これによりイベントから操作しやすくなります。 This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicod
hifiveのチャートライブラリの使い方を紹介します。今回はグラフを移動させるデモです。 ベースはチャートライブラリの使い方(1)「基本編」 | hifive開発者ブログのグラフになります。 実行しているところは下記の通りです。こちらのURLにてサンプルを試せます。 HTMLのボタンを追加 HTMLを次のように修正します。進む、戻るのボタンを追加します。 This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirec
The first dedicated IDE for React web application development An extensible developer environment in one clickReactide runs an integrated Node server and custom browser simulator eliminating the need to configure any servers, build-tools, and even offers hot module reloading right out of the box. Streamlined configurationsTo get started, just input your .js and .html entry points inside Reactide's
NewsBlur NewsBlur is a personal news reader bringing people together to talk about the world. A new sound of an old instrument. www.newsblur.com. Created by Samuel Clay. Twitter: @samuelclay and @newsblur. Features Shows the original site (you have to see it to believe it). Hides stories you don't want to read based on tags, keywords, authors, etc. Highlights stories you want to read, based on the
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く