大なごやJS#3(2012/07/21)で使ったスライドです。割と「当たり前のこと」をまとめなおしただけな感じです。
シンプルなHTMLで、さまざまなデザインの円グラフが簡単に作成できるjQueryのプラグインを紹介します。 EASY PIE CHART [ad#ad-2] EASY PIE CHARTの使い方 実装は、3ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプト・スタイルシートを外部ファイルとして記述します。 外部ファイルはhead内に記述してください。 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript" src="/path/to/jquery.easy-pie-chart.js"></script> <link rel="styl
ユーザーがリンクをクリックして、サイト内の存在しないページにアクセスすると、サーバーから 404(ページが見つかりません)エラーが返されます。このような一般的なメッセージはユーザーにとって有用でないため、独自の 404 ページを作成して、サイトに関する役立つ情報を提供することをおすすめします。 また、ウェブマスター ツールの 404 ウィジェットをカスタム 404 ページに追加することができます。404 ウィジェットは、エラー メッセージの代わりに有効なヘルプを自動的に提示します: サイトの検索ボックスと検索の候補を表示します。 間違った URL に対する URL の候補を提示します。 これにより、ユーザーは必要な情報を見つけやすくなるため、別のサイトに移動する可能性が低くなります。 注: 現在のところ、ウィジェットはテスト機能なので、一部のサイトに対しては、最も近い URL や URL
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 個人的なメモ。普段さほど使うことが 無いので、必要な時に探すのに時間 掛からないようにまとめておきます。 沢山ある必要はさほど無いのですが、 勉強用も兼ねていろいろと数を揃えて おきました。 お問い合わせフォームのユービザリティ向上として導入されるバリデーション用のjQueryプラグインのまとめと、その他Tipsやフォームデザイン周りの情報をちょろっと。一応動作だけIE6、7でも確認しています。 exValidation 安心(?)の国産プラグインです。複雑なフォームにも対応できるのでとりあえずこれを覚えておけば安心ではないかと思います。 どんなフォームにも使えるjQueryのフォームバリデーション exValidation jquery.validate.js V
最近パララックス(視差効果)を取り入れたサイトが増えてきました。 仕組みや簡単なものを作れるようにしておきたかったのでいろいろ試してみました。 ちなみにもっと効率良く作れる方法とかもあるかもしれませんので、一例ということで御覧ください。プラグインはまだ試したことがないので そちらを使ったほうが楽かもしれません。 パララックス効果のjQueryプラグインまとめ あと動作はこの記事時点でのFirefoxの最新版でしか確認はしていません。 スクロール量を取得する まずはスクロールすると動くので、スクロール量を取得します。ちなみにjQueryを使ってます。 $(function(){ $(window).scroll(function(){ var y = $(this).scrollTop(); $("#num").text("スクロール量:" + y);//表示用 }); }); サンプルペー
2013年初頭にリリースを予定しているjQuery 2.0では、Internet Explorer 6/7/8のサポートをしないという方針が、jQueryのブログ「jQuery Blog » jQuery Core: Version 1.9 and Beyond」で明らかにされました。 jQueryは現在1.7が最新バージョンで、先週1.8β1が公開されたばかり。ブログによると、この先のロードマップは次のように説明されています。 jQuery 1.9 (early 2013) 1.8で使用されなくなったインターフェイスの多くを削除。そのうちのいくつかはプラグインか代替APIでサポートされる。 jQuery 1.9.x (ongoing in 2013 and beyond) 継続してバグフィクスを行う。 jQuery 2.0 (early 2013, not long after 1.9)
NVD3.js :: re-usable charts for d3.js 様々なグラフを描画できるJavaScriptライブラリ「NVD3.js」 d3.jsという以前紹介したライブラリをベースに利用しているみたい。 グラフ描画のライブラリは色々ありますが、こちらのライブラリで描画するグラフのデザインもなかなかいい感じですね マウスとのインタラクティブなグラフ実装が可能で拡張も容易みたい サンプルページにはソースがついているので参考に組めば抵抗なくグラフが描けそうです 関連エントリ 見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」 HTML5で綺麗でインタラクティブなグラフが描けるライブラリ「Flotr2」 様々な時系列グラフを描画できるJavaScriptライブラリ「Rickshaw」 クールなドアノブ風の%グラフを描画できるjQuery Knob
先週&今週は、出張でアメリカ西海岸。そんな折、先週の金曜日(16日)の夜に BayJax meetup が Yahoo! 本社で開催されるということで、参加してきました。 BayJaxは、シリコンバレー地区のAjax & Javascriptに関するMeetUp。大体、半年おきに開催されているようです。今回参加したMeetUpの形態は、Conference形式(勉強会ののりに近い)。日本との勉強会との違いは、最初にピザを食べてお腹が満たされたところで勉強会が始まることと(こっちの考え方の方が、確かにリーズナブル)、質問が活発なこと(海外では一般的なことですが)。とても、楽しい時間を過ごすことが出来ました。 その中で講演された AngularJS について、今回は紹介します。 AngularJS AngularJSは、とてもシンプルにWeb Appを書くことができる軽量な MVC フレームワ
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
グーグルが開発したJavaScript MVCフレームワーク「AngularJS」を紹介した1つ前の記事の反応が予想以上に大きく、1日たたずにブックマークが500以上もつきました。 本記事では、AngularJS以外にもすでにたくさん存在するJavaScript MVCフレームワークに関する情報をまとめて紹介したいと思います。 JavaScript MVCフレームワークの比較記事 既存のJavaScript MVCフレームワークを比較した記事が「The Top 10 Javascript MVC Frameworks Reviewed」です。Top10と書いてありますが、12種類のフレームワークの比較です。これは公開当時は10種類だったものが、その後11種類になり、今回のAngularJSの公開で12種類になったためです。 上記のような比較表を載せた上で、12種類すべての利点と欠点を説明し
グーグルは、JavaScriptでMVCアーキテクチャのアプリケーション開発をする際に便利な機能を備えたライブラリ「AngularJS 1.0」のリリースをブログで発表しました。 MVCアーキテクチャとは、ソフトウェアがデータモデル(Model)の部分とユーザーインターフェイスの部分(View)、そしてビューとモデルのあいだで制御する部分(Controller)に分離された構造のことを指します。 これらが分離されているとプログラムの見通しがよくなり変更にも対応しやすく、テストも容易になるため、何種類ものユーザーインターフェイスと複雑なロジックなどから構成される大規模なアプリケーションではMVCアーキテクチャの採用が望ましいものと考えられています。 しかしWebアプリケーションをMVCアーキテクチャで実現しようとすると、ビューの役割を果たすHTMLのコードの中に、どうしても複雑なJavaSc
もう何年も前になりますが、 以前開発してたプログラムを同業他社がコピペして使っていたのをたまたま発見し、頭に来て弁護士さんに相談したときのお話しです。 あたしってほんとバカ ある日、いつものようにお昼ごはんを食べながらニュースサイトを眺めていると、新しく競合他社がサービスを開始したというので早速チェック。 ふむふむ。中々よく出来てるなぁと感心しながら触っていたのですが、不思議なことに使えば使うほどデジャブに襲われたんですよ。どっかで見たことあるな、これ…と。 「……まさかな」と思いながらおもむろにブラウザの「ソースを表示」した瞬間我が目を疑いました。フレームワークも、もちろんそれを使ったコードもほぼそのまま。ご丁寧に変数名までバッチシ同じ。十中八九コピペされてると核心しました。思わずセブンのおでん吹くかと思いましたよ。危ない危ない。 悔しいじゃないですか。 表に見えるコードはJavaScr
2013年1月26日追記 時代の移り変わりとともに、このソースでは対応できなくなっているので 続:Androidブラウザでviewportのwidth指定[to-R] こちらのやり方がいいと思います! これを横に回転させて、 画面幅に合わせて拡大したい。 これ、見にくくないのかな...と個人的には思うんですが、そういう依頼がちらほら来るのでまとめてみました。 サンプルページ http://sakaki0214.com/sample/110605/ 通常(横にしても拡大しない) <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1" /> iPhone用(横にすると拡大する) <meta name="viewport" content="wid
jSignature ブラウザ上でサインを書けるjQueryプラグイン「jSignature」。 CanvasかFlashで描画出来るので多くのブラウザに対応。ウェブサイトにサインを導入したい場合に使えるかも 実装は以下のように超簡単です <script src="libs/jSignature.min.js"></script> <div id="signature"></div> <script> $(document).ready(function() { $("#signature").jSignature() }) </script> データをSVGのbase64形式で取得できたりもするみたい デモページはこちら サイン書いてみました(^^) 関連エントリ アイテムを浮遊させられるjQueryプラグイン「jqFloat」 一見普通のテーブルだけどExcel風に使えるjQueryプ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く