1.simplelibとは simplelibとはjQueryを利用した様々なプラグインを動的にロードして、ウェブサイトを構築する上でよく使う機能を一元管理するためのツールです。 各プラグインを別ファイルにし、必要なファイルだけをロードします。ダウンロードはこのページの一番下にあります。 2.プラグイン一覧 現在以下のようなプラグインがあり、HTMLに1行追加するだけでこれら全ての機能を追加できます。 accordion
https://github.com/tokuhirom/micro_dispatcher.js javascript 用のシンプルな Dispatcher にはいくつかあるが、どうも満足いくシンプルな実装がなかったのでつくった(というか Caym というオレオレ JS Framework の中にうまっていたものをとりだした)。 特徴としては、 Dispatcher だけのシンプルな実装(本体はやや冗長にかいていて、40行程度)sinatra 的なシンプルな記法といったところでしょうか。 使い方は以下のとおり。 var dispatcher = new MicroDispatcher() dispatcher.register('/', function () { }) dispatcher.register('/member/:name', function (name) { alert
画面をダブルクリックで縦書きと横書きを切り替えることができます。要素を指定して縦書きにしている場合は、次回アクセス時に同じ表示が引き継がれます。 どんなサイトでも縦書きにするブックマークレット。 ↓右クリックで「お気に入り」に保存するか、リンクをドラッグしてブックマークバーにドロップします。 「縦書きにする・iPhone 用リンク」 「縦書き可能にする・iPhone 用リンク」 「段組み縦書き可能にする・iPhone 用リンク」 iPhone に登録するには? とりあえずこのページを共有ボタンからブックマーク。 iPhone 用リンク を長押ししてコピー。 ブックマークを開いて、追加したブックマークを「編集」。 名前を「縦書き可能にする」などに変更し、URL 欄に上記コードをペースト。 最初の「http://」を削除。 注意! やや動作が重いです! うまく変換できなかったときは、画面をダブ
Flash界最強ライブラリの一角 jQuery animateよりも圧倒的パフォーマンス。Flashの最強アニメーションライブラリTweenMax。JavaScript版があるのはご存知でしょうか。 TimlineMax/Lite TweenMax/Liteの4つのライブラリ群の総称でGSAP JSというパッケージ構成です。※要ライセンス注意(後述) まずはその圧倒的パフォーマンスを体感してください。プルダウンから主要ライブラリを選んで、STARTを押すと右下のfpsの数値が変わります。 GreenSock Animation Speed Test 豊富なアニメーション機能 GSAP JSの主要な機能として下記の物が挙げられます。パララックスなどのインタラクティブなサイトを作る上でもとてもすごく重宝しそうです。 ベジェアニメーション 繰り返し 逆再生 時間指定 一時停止 フレームラベル ゆ
IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 2012年10月09日- ResponsiveIframes.js IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 ページ内や画像をレスポンシブ対応にするものはありますが、ページ内に貼りつけたiframeでさえもブラウザサイズに応じて伸縮させることができます。 単にiframeのサイズを変えるだけじゃなくてiframeの中身のサイズも変えなくてはいけないため、結構大変そうですがライブラリで簡単に対応できそうですね 関連エントリ ブロック要素の高さを簡単に揃えられるjQueryプラグイン「equalize.js」 Gmailスタイルのemoticonを実装できるjQueryプラグイン クリックで水滴を落としたようにアニメーションさ
JavaScriptライブラリのニュータイプ「jQuery」。 jQuery is a new type of JavaScript library. jQuery: The Write Less, Do More, JavaScript Library ニュータイプと聞いては黙っていられないニュータイプファンの皆様こんにちは、公開APIを利用したサンプルサイトを作っていくよ管理人のZAPAです。 Web2.0やらAjaxやらの言葉が流行っていても、実際にそれっぽいものを作ろうと思ったところで、初心者は一体どこから手を付けて良いのかわからないのが現実だったりします。 そこで今回は、Web2.0っぽくAjaxを実現させることができるライブラリ「jQuery」の紹介をします。 Ajaxとは ここで言うAjaxは、オランダの名門フットボールチーム「アヤックス」ではなく、ウェブブラウザ内で非同期通
※ 画面は公式サイトデモより JavaScriptのデバッグによく利用されるものと言えば、alertだろう。簡単に使えて便利な関数だが、ブラウザの処理が止まってしまったり、長文の表示が難しいなどデメリットも数多い。 alertとお別れするためのJavaScriptデバッグツール そこで使ってみたいのがBlackbirdだ。Google Code上で公開されているオープンソースのJavaScriptアラートだ。 Blackbirdは見た目の格好いいフローティングダイアログにログを表示できる。デバッグ、インフォ、ウォーニング、エラー、プロファイルの5つのメッセージパターンが設定できる。Blackbirdのウィンドウでは各メッセージタイプの表示、非表示が切り替えられるようになっている。 表示位置の変更、表示するメッセージの種類が変更できる さらにF2キーを押して表示/非表示を切り替えたり、Shi
特徴 配置と動きに特化した Javascriptライブラリです。 シンプルで柔軟性もあり、 処理も高速です。 対応OS / ブラウザ iOS 7+ Android 4.1+△ Android 4.4+○ IE9+ Safari latest Chrome latest Firefox latest
https://github.com/tokuhirom/node-perl/ ここ最近、プログラミング言語同士の壁が徐々に破壊されている気がします。あるプログラミング言語上で別なプログラミング言語を動くようにしたり、置き換えてしまったりするような類です。今回はその一つ、CPAN moduleをnode.js上で動かすという、かなり無茶な気がしなくもない、そんなソフトウェアnode-perlを紹介します。 var Perl = require('../index.js').Perl; var perl = new Perl(); perl.use('LWP::UserAgent'); var ua = perl.getClass('LWP::UserAgent').new(); var res = ua.get('http://mixi.jp/'); console.log(res.as_
Home - Recline Data Explorer and Library 色んなデータを便利に表示できる「Recline.js」 データをExcel表風にしたり、グラフを描画したり、タイムラインにしてみたり、データを地図上にプロットしてみたりといったことが出来るライブラリだそう。 テーブルビュー。ソートなんかもできてこれだけでもリッチです このデータからグラフにしたいモノを選んでグラフ化も可能 データを元にタイムライン表示もできるみたい データを元に、地図上にプロットするなんていうこともできます なかなか面白いですね 関連エントリ 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」 美麗なグラフをSVGで描画できるJSライブラリ「dc.js」
Holder.js - client side image placeholders 画像のプレースホルダを生成してくれるJSライブラリ「Holder.js」 <img src="holder.js/300x200"> と書くとcanvasを使い、指定したサイズの画像をクライアントサイドで描画してもらえるというもの。 JSなのでサーバ不要でオフラインでも作業できます。 こうした画像をよく使う方は、いちいち作るのは面倒なので、JSコードで書いて画像化できたらなかなか便利ですね 関連エントリ HTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 ストレス無しでGoogleマップを使ったサイトが作れる「gmaps.js」 ブラウザ上でPDFを表示するJSライブラリ「PDF.js」
dc.js - Dimensional Charting Javascript Library 美麗なグラフをSVGで描画できるJSライブラリ「dc.js」 次のような円グラフや棒グラフをオブジェクト指向の分かりやすいコードで描画出来ます。 円グラフのコード例。メソッドをチェーンさせて直感的にグラフを描画可能。 SVG対応していないブラウザでは描画できませんが、軽くてよさそうですね 関連エントリ 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」 HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」
iOS.jsはiOS対応のWebサイトを作る際に役立つ機能を提供するJavaScriptライブラリです。 iOS向け最適化サイトを作る際には二種類の方法があります。jQuery MobileやUiUIKitのようなテーマを使って作っていく方法と、フルスクラッチです。もしフルスクラッチで作っていくならば一緒に使ってみてほしいライブラリがiOS.jsです。 通常だとこんな感じに表示されてしまうページが… iOS.jsを通すことでマックス表示にできます。 こんな感じに重なってしまうページも… iOS.jsを通すと適切に分かれて表示されます。 その他、こうやって画面サイズの取得もできます。 iOS.jsではその他、Webアプリモードとして動かしている場合はリンクのターゲットを指定してMobile Safariに飛ばないようにしたり、iOSデバイス限定のスタイルシート設定を加えられたり、iPhone
This library reads PHP code and transforms it into JavaScript code which can be run in the PHP VM in this library, resulting in same results as with PHP. It starts by tokenizing the PHP code into tokens, which it then uses to build an AST tree. Once the tree has been constructed, the script compiles it into JavaScript that can be interpreted by the VM and then executes it. Any additional unconvert
jQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications. Rich effects and UI widgets jQuery UI features low-level effect and interaction API's as well as full-featured and highly configurable ready-to-use widgets. Suppor
結論:Highchart ccchart(canvasChart)と悩みましたが、Highchartを選んだ理由は、下記の通りです。 1.円グラフや棒グラフを組み合わせた複合的なグラフのサンプルを載せている 2.複合グラフのアニメーションがかっこいい 商用ライセンスなので、無料にこだわる方は、ccchart(canvasChart)がおすすめです。 Highchart 表現力、完成度の点でいちばんだと思います。商用なのでお金さえあればこれがイチオシ。 ccchart(canvasChart) 私のイチオシは canvasChart です ライセンスは PUBLIC DOMAIN! raphael.js qiitaのプロフィールの円グラフで使われているjQueryプラグイン 美しめなグラフを作成することができる。 raphael.jsのプラグインのelycharts.js http://el
This project is an attempt to build re-usable charts and chart components for d3.js without taking away the power that d3.js gives you. This is a very young collection of components, with the goal of keeping these components very customizable, staying away from your standard cookie cutter solutions. View more examples » GitHub Repo Download d3.v3.js. This is the only required library for NVD3. Dow
NVD3.js :: re-usable charts for d3.js 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 d3.jsという以前紹介したライブラリをベースに利用しているみたい。 グラフ描画のライブラリは色々ありますが、こちらのライブラリで描画するグラフのデザインもなかなかいい感じですね マウスとのインタラクティブなグラフ実装が可能で拡張も容易みたい サンプルページにはソースがついているので参考に組めば抵抗なくグラフが描けそうです 関連エントリ 見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」 HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」 様々な時系列グラフを描画できるJavaScriptライブラリ「Rickshaw」 クールなドアノブ風の%グラフを描画できるjQuery Knob
CDNでウェブサイトを高速化するためのまとめです。 「そんなの知ってるよ」という方も多いと思いますが、バージョンの指定方法や、キャッシュ・フォールバックなど、CDNに関する情報を集めましたのでご覧いただければ幸いです。 認識誤り等ありましたらどこかでつぶやいてください。 1.CDNとは CDNとは「Contents Delivery Network(コンテンツデリバリネットワーク)」または「Contents Distribution Network(コンテンツディストリビューションネットワーク)」のことで(注)、コンテンツを配信するために最適化されたネットワークを指します。 Wikipediaの「コンテンツデリバリネットワーク」の説明によると、次のサービス(企業)が著名な商用CDNサービスを提供しているようです。 Akamai Technologies Limelight Networks
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く