Event handling with anon-func style on iOS / Android - 愛と勇気と缶ビール
JavaScriptでユーザからのイベントを受け取ってホゲホゲ、という処理は大体次のようなスタイルで書く。なお、jQueryとか使っていても概要は同じ。 el.addEventListener("eventName", function(evt) { // do something }, false); iOS appでこのようなイベントハンドーリング的処理を行う場合、基本的にはdelegateを使う。 -(id)init { self = [super init]; if ( self != nil ) { Foo* foo = [[Foo alloc] init]; foo.delegate = self; Bar* bar = [[Bar alloc] initWithsomething:nil target:self selector:@selector(didReceiveBar
HTML5 Canvasで画像を白黒化する方法
Basically, we’re a small design agency located in Montreal, Canada. HTML5 Canvas Image Effects: Black & White - SpyreStudiosにおいて、HTML5のCanvas機能を使って画像を読み込み、さらにその画像を白黒画像に変換して表示する方法が紹介されている。Canvasを使ってどのように画像加工処理を実施するかのテンプレートとして参考になる。 紹介されている機能はソースコードを見るとわかりやすい。次に、HTML5 Canvas Image Effects: Black & Whiteで紹介されているコードを参考にサンプルとして実行しやすくしたものを掲載する。HTMLファイルと同じフォルダに、コードの下に掲載した画像のリンク先に表示される元画像をbeer.jpgファイルとして置
Gianluca Guarini - black and white image jQuery plug-in
Crossbrowser Html5 Black and white jQuery plug in Just one line of JS Code SIMPLE FAST AND STRONG 1 add jQuery js and plug in js to the page <script src="js/jquery.min.js"></script> <script src="js/jQuery.BlackAndWhite.js"></script> 2 add this class to the wrapper of the image that you want make in Black and White class="bwWrapper" 3 set the wrapper in this way from the css: .bwWrapper { positi
[JS]カラー画像を白黒に自動変更して表示する画像ギャラリー -Black and White
カラー画像を白黒のグレースケール画像に自動変更して表示する画像ギャラリーのjQueryのプラグインを紹介します。 デモページ：マウスホバー（2番目）でカラー表示 Black and Whiteの実装 外部スクリプト 「jquery.js」と当スクリプトを外部ファイルとして指定します。 <script src="js/jquery.min.js"></script> <script src="js/jQuery.BlackAndWhite.js"></script> HTML 画像を内包するa要素に「class="bwWrapper"」を加えます。 <ul id="wrapper"> <li><a href="#" class="bwWrapper"><img src="files/Hydrangeas.jpg" width="300" height="225" /></a></li> <l
『JavaScriptのテスト手法』
みなさんはじめまして。 2011年11月に中途で入社し、現在はAmeba事業本部でスマートフォン版Ameba（通称デカグラフ）の開発をしている川口（facebook）と申します。 JavaScriptにおけるテストフレームワーク JavaScriptにおけるテストフレームワークとしては、有名なもので現在以下のものがあります。 ●JsUnit Javaのテストフレームワークとして有名な「JUnit」を参考に作られたテストフレームワークです。 ●QUnit もともとjQueryをテストするために開発されたフレームワークですが、現在ではjQueryへの依存が無くなっているためjQuery以外のライブラリを使ったプロジェクトでも使用できます。 ●Jasmine
メモログ
💡 Personal notes about somthing I'm interested in いわゆるPinterest風な縦方向にfloatさせるjQueryのpluginが.net Magazineで紹介されていたので、試してみました。floatさせたいコンテンツのclass（と全体を囲っているコンテナのclass）と、1カラムあたりの幅を指定するだけで、縦方向にfloatさせることができます。便利。写真の記事一覧画面とか、写真があるとやはり映えますなあとか、悦に入っています（写真最近撮ってないな）。 オプションもいろいろあって、jQuery Mansoryに書かれています。isFitWidthをtrueにすると、表示幅にあわせて横に配置できるコンテンツの数を自動的に調整してくれるのでそれを指定。 どのように縦方向にfloatさせるかというと、コンテンツのdivにpositio
こてさきAjax:クールなMVCを実現するフレームワーク Angular.js の紹介 - livedoor Blog（ブログ）
先週＆今週は、出張でアメリカ西海岸。そんな折、先週の金曜日（16日）の夜に BayJax meetup が Yahoo! 本社で開催されるということで、参加してきました。 BayJaxは、シリコンバレー地区のAjax & Javascriptに関するMeetUp。大体、半年おきに開催されているようです。今回参加したMeetUpの形態は、Conference形式（勉強会ののりに近い）。日本との勉強会との違いは、最初にピザを食べてお腹が満たされたところで勉強会が始まることと（こっちの考え方の方が、確かにリーズナブル）、質問が活発なこと（海外では一般的なことですが）。とても、楽しい時間を過ごすことが出来ました。 その中で講演された AngularJS について、今回は紹介します。 AngularJS AngularJSは、とてもシンプルにWeb Appを書くことができる軽量な MVC フレームワ
グーグル製のJavaScript MVCフレームワーク「AngularJS」、正式版が公開 − Publickey
グーグルは、JavaScriptでMVCアーキテクチャのアプリケーション開発をする際に便利な機能を備えたライブラリ「AngularJS 1.0」のリリースをブログで発表しました。 MVCアーキテクチャとは、ソフトウェアがデータモデル（Model）の部分とユーザーインターフェイスの部分（View）、そしてビューとモデルのあいだで制御する部分（Controller）に分離された構造のことを指します。 これらが分離されているとプログラムの見通しがよくなり変更にも対応しやすく、テストも容易になるため、何種類ものユーザーインターフェイスと複雑なロジックなどから構成される大規模なアプリケーションではMVCアーキテクチャの採用が望ましいものと考えられています。 しかしWebアプリケーションをMVCアーキテクチャで実現しようとすると、ビューの役割を果たすHTMLのコードの中に、どうしても複雑なJavaSc
明日のためのクライアントサイドMVC
Alignment and Autonomy in Cybozu - 300人の開発組織でアラインメントと自律性を両立させるアジャイルな組織運営 / RSGT2025
社内勉強会でクライアントサイドMVCについて話しました - はてブロ@ama_ch
こんにちは。日曜から盲腸で入院中のama-chです。 普段は不健康の代名詞みたいに扱われていますが、これでも小学校は修学旅行の日以外は皆勤だったし、入院するのも初めてなんです。 退屈な入院生活ですが、PCとモバイル通信環境があると一気に世界が開けます。電源、食事、ベッドの三拍子が揃った理想的な職場がそこにはありました。難点といえば、21時に強制消灯されてしまうことと、なかなか風呂に入らせてもらえないことくらいです。 風呂の話はさておき、今年の2月頃から社内で「フロントエンド勉強会」というものを始めています。 JavaScript, CSS, HTML5, UI/UXなど、フロントエンドに関するテーマでざっくばらんに毎週開催しています。だいぶ前になっちゃいましたが、4月にその勉強会でクライアントサイドMVCについて話したので資料を公開します。 明日のためのクライアントサイドMVC 試しにSp
JSのUnitTest関連技術
IDEを使えばテストの定義が簡単実ブラウザでテストを実行するので検証が確実標準で画面遷移も含めた結合テストをサポートhtmlの切り出しが不要で実サービスを使ったテストが可能CIサーバとの連携が可能
tDiary: socialbuttonプラグインにPinterestボタンを追加 - ただのにっき(2012-05-19)
■ tDiary: socialbuttonプラグインにPinterestボタンを追加 Twitterで「Pinterestボタンが欲しい」というリクエストを受けたので調べてみたらPinterestにもソーシャルボタンがあるんだな。知らんかった。 単純なものなので、同梱しているjquery.socialbutton.jsを拡張して対応した*1。もっとも、画像のURLを指定しないといけないのだが、1個に限るので複数の写真を含むエントリの場合は困る。まぁ、そういう場合は普通にBookmarkletを使ってくださいと割りきって、最初の画像を指定することにしたのだった。
カラーピッカー.js - JavaScript ライブラリー - HTML5.JP
対応ブラウザー Internet Explorer 6 以上 Firefox 2.0以上 Opera 9.0以上 Safari 3.0以上（もしかしたら2.0でも動作するかもしれませんが、未確認です。） Google Chrome 0.3以上 使い方 cpick_x_x_x.zipを解凍し、html5jpフォルダをウェブサーバにそのままアップロードしてください。そしてHTMLのhead要素内に、cpick.jsをロードするようscriptタグを記述しておきます。このサンプルは、html5jpフォルダが一階層上に存在しているものとしてscript要素のsrc属性を指定していますが、html5jpフォルダ はどこに設置しても構いません。html5jpフォルダの設置場所に合わせてcpick.jsをロードするscript要素のsrc属性を書き換えてください。
クライアントサイドMVCについて喋った - mizchi log
月曜日のclient-side templating 勉強会 http://atnd.org/events/28189 で喋った内容をうろ覚えに書き出す。 クライアントMVCが求められるようになった背景 AJAXの流行 PushStateの流行の兆し メディア系のゲームで使えるAPIの充実 今まではページ遷移の度にJSのオブジェクトを破棄していた。 => シングルページでリッチなコンテンツが作れるようになり、JSのやることが増えた PushStateとは 遷移なしにURLを書き換える技術。HTML5 History API。 Twitter, Github, Facebook URLを書き換えるだけなのでコンテンツ(DOM)の操作はアプリ製作者に一任されている。 大規模なHTML書き換えに、クライアントサイドテンプレーティングが重要になってきた。 PushStateのライブラリ defun
カウントダウン終了後に任意のコードを実行できる軽量jQueryプラグイン・jquery-countdown - かちびと.net
カウントダウンタイマーの実装と 終了後に任意のイベントを発生 させられるjQueryのプラグイン、 jquery-countdownのご紹介です。 たまに見かけるやつですね。使用 頻度は高くは無さそうですけど。 ローンチ前のComing soonページなんかでたまに見かけるやつです。スクリプトも軽量です。 カウントダウンアニメーションを実装します。終了後にコードを実行させる事も出来ます。時計部分はCSSスプライトを利用した画像を使用しているようです。 動作サンプル サンプルです。再生ボタンで動作テスト出来ます。 日をまたぐようなカウントダウンならもう一工夫必要ですね。 <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> <
はじめてのスマートフォンサイト制作「jQuery Mobile を使った制作編」
前回の基礎知識や開発環境の準備編で、基本的な勉強や開発環境は揃えましたので、本記事では具体的な制作に入っていきます。 どんな風に作るのか ハイクオリティで広範囲のプラットフォームに対応したスマートフォンサイトを作りあげるにあたって jQuery Mobile を使用していきます。また URL は統一して（スマホサイトを別 URL で作成せず）スマホアクセス時にスマホ用の出力に最適化します。そのため、サイトの構造に変更は加えませんが、全てのページにおいてスマホ用のレイアウトを出力できるように変更を加えていきます。 jQeury Mobile について スマホサイトの作成に jQuery Mobile について学んでいきます。今まで jQuery Mobile を使用したことがありませんので、今回一から全て勉強しました。といっても、基本的なことは全て下記サイトにありますので、jQuery Mo
Rainbow
Rainbowはコードのシンタックス・ハイライトをやってくれるJavaScriptライブラリ。拡張の仕組みが凄く書きやすそうで良さそう。名前は悪い。しかもリダイレクト先のURLはrainbowsだし……。まぁとにかく乗り換えようかなとちょっと思った理由をちょっと書いておく。「ちょっと」なのでまだあんまり乗り換える気ない。 書きやすいといっても所詮は正規表現なので、定義フォーマットがGoogle Code Prettifyの黒魔術的なアレよりもちょっとシンプルだとかそういう意味にすぎない。なのでこの点だけでは既存の様々なシンタックス・ハイライトしてくれるライブラリから乗り換えるという程のパワーがあるわけではないと思う。他にもpre要素の子ではないそこらのcode要素のハイライトにも対応している所とかすごいと思うんだけど、おまけ機能的な感じでこれも乗り換えの動機にはならなそう。 僕が乗り換えよ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
crocos.jp
IEでconsoleが定義されてないと怒られる。 - このブログは証明できない。
chikathreesix.com - このウェブサイトは販売用です！ - chikathreesix リソースおよび情報