RIAトピックス
リッチクライアント/RIAを主テーマに取り扱います。Flex、Ajax、AIR、Silverlight、JavaFX、etc。
スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

【gihyo.jp】面白法人カヤック,JavaScript,HTML5, CSSの投稿共有コミュニティサイト「jsdo.it」を開設
http://gihyo.jp/news/nr/2010/06/1802

 6/18(金)、株式会社カヤックは、JavaScript,HTML5,CSSを投稿して共有するコミュニティサイト「jsdo.it」を開設しました。

 以前から同社が公開している「wonderfl」というサービスがあります。wonderflはブラウザ上のみでActionScriptでFlashが開発・公開できるというサービスで、多くのFlasherに活用されています。今回リリースされた「jsdo.it」はそのJavaScript版にあたります。HTML5が導入された事でFlashさながらの多彩な表現ができるようになったことから、様々な作品が掲載されることが期待できます。

 jsdo.itの主な機能は以下。
  • Build from scratch … ブラウザ上でアプリを開発・共有
  • Fork … 他者が開発したアプリを引用して追加開発
  • Download … 気に入ったアプリのソースコードをローカルに保存


 jsdo.itもwonderfl同様、無料で利用する事が可能です。既にwonderflとjsdo.itを連携させた豪の者も出現しています。腕試しに、勉強に、是非利用してみてはいかがでしょう?



ヨウイチ
スポンサーサイト

テーマ:プログラミング - ジャンル:コンピュータ

jQueryで行うFlashみたいなスプライトアニメーションのチュートリアル
jQueryで行うFlashみたいなスプライトアニメーションのチュートリアル 【phpspot開発日誌より】
http://phpspot.org/blog/archives/2010/06/jqueryflash.html

アニメーションと言えばいまだFlashが全盛ですが、Javascriptでもそれなりに動かす事ができるようになってきているようです。
ソースと、動画での解説(英語ですが雰囲気で理解できます)を見ると、凄く簡単に動かせるようです。

Flashの代替方法の一つとして目を通してみてはいかがでしょうか?



RIAトピックス HTML5+JavaScriptでFlashコンテンツを再現する「Smokescreen」
http://mfria.blog106.fc2.com/blog-entry-1826.html

K.Y

テーマ:プログラミング - ジャンル:コンピュータ

JavaScriptのcall.applyの不思議
JavaScriptのcall.applyの不思議 (wtfjsを解説) 【風と宇宙とプログラムより】
http://d.hatena.ne.jp/mindcat/20100516/1273992426

下記のJavascriptが2を返す理由がわかりますか?
alert.call.call.call.call.call.apply(function (a) {return a}, [1,2]) // 2

結論から言いますと、下記と同じ事を行っているようです。
(function (a) { return a }).call(1, 2);

一つ一つ丁寧に解説を行ってくれていますので、便利なものの理解が難しいapplyとcallメソッドの理解にも繋がると思います。(詳細は下記リンクをどうぞ)



applyとcallの使い方を丁寧に説明してみる 【あと味より】
http://d.hatena.ne.jp/jdg/20100515/1273903873

JavaScriptのapplyヤバい 【++iskwn - キューイチ世代より】
http://generation1991.g.hatena.ne.jp/iskwn/20100204/1265262870

callとapply 【emergentのJavaScript入門日記 - g:javascriptより】
http://javascript.g.hatena.ne.jp/emergent/20081029/1225297440

K.Y

テーマ:プログラミング - ジャンル:コンピュータ

細かいJavaScriptの仕様や習慣やテク集
細かいJavaScriptの仕様や習慣やテク集 【三等兵より】
http://d.hatena.ne.jp/sandai/20100427/p1

基本的な仕様から、細かい仕様やハマリ所を説明しながら、テクニックなどを紹介してくれています。
テクニックについては言わずもがなですが、Javascriptは細かい仕様に引っかかる事が多いため確認のためにも必見です。

コメント欄や、トラックバックされているblogなどの突っ込みに目を通す事で更に深い知識が得られると思います。



javascript - Array.prototype.slice.apply(arguments) // 引数一発配列化 【404 Blog Not Foundより】
http://blog.livedoor.jp/dankogai/archives/51439807.html

RIAトピックス JavaScript初心者におくる24のグレイトなtips
http://mfria.blog106.fc2.com/blog-entry-1687.html

K.Y

テーマ:プログラミング - ジャンル:コンピュータ

作って学ぶ!jQuery
作って学ぶ!jQuery 【バシャログ。より】
http://c-brains.jp/blog/wsg/10/04/19-185826.php

Javascriptの汎用ライブラリjQueryの基礎講座がバシャログ。さんで行われています。
セレクタの指定から始まり、サンプルを作成することでjQueryを学んでいけるようになっています。
そのサンプルも動きがあるサンプルを選択しているため、見た目にも楽しく行えると思います。

全6回の連載のようですので、興味のある方はこれを機会にjQueryに触れてみてはいかがでしょうか?



[作って学ぶ!jQuery] 第0回 jQuery とは? 【バシャログ。より】
http://c-brains.jp/blog/wsg/10/04/19-185826.php

[作って学ぶ!jQuery] 第1回 セレクタを学ぶ 【バシャログ。より】
http://c-brains.jp/blog/wsg/10/04/20-215231.php

[作って学ぶ!jQuery] 第2回 アニメーションを学ぶ 【バシャログ。より】
http://c-brains.jp/blog/wsg/10/04/23-100000.php

[作って学ぶ!jQuery] 第3回 画像ロールオーバーを作って学ぶ 【バシャログ。より】
http://c-brains.jp/blog/wsg/10/04/26-105520.php

RIAトピックス 40分で覚える!jQuery速習講座
http://mfria.blog106.fc2.com/blog-entry-1739.html

RIAトピックス jQueryの凄さがわかるサイト各種
http://mfria.blog106.fc2.com/blog-entry-1686.html

jQuery 日本語リファレンス
http://semooh.jp/jquery/

テーマ:システム開発 - ジャンル:コンピュータ

ロックを解除しないと送信不可能にするJavaScript「slideLock」
ロックを解除しないと送信不可能にするJavaScript「slideLock」 【skuare.netより】
http://www.skuare.net/2010/04/javascriptslidelock.html
※サンプルは最下部「記事作成:2010年04月06日」とある上にあります。

BLOGのコメント、トラックバック、掲示板、メールフォームなどではスパムを避けるために、文字認証を導入している所が数多くあります。
しかし、これらは味気なく、わかり辛い事が多いです。

そんな時に導入したいのが、jQueryプラグインの「slideLock」です。
「slideLock」を導入すると、バーが表示されそのバーをドラッグする事でロックが解除され、情報を送信できる仕組みになっています。
言葉で説明してもわかり辛いので、元記事を見てみて下さい。

味気ない認証を変化させることで個性を持たせてみてはいかがでしょうか?

K.Y

テーマ:システム開発 - ジャンル:コンピュータ

1文字ずつアニメーションしながらヘッドライン表示できるjQueryプラグイン「News Ticker」
1文字ずつアニメーションしながらヘッドライン表示できるjQueryプラグイン「News Ticker」 【phpspot開発日誌より】
http://phpspot.org/blog/archives/2010/04/1jquerynews_tic.html

リアルタイムで打ち込まれているようにテキストを表示するjQueryプラグインの紹介です。
画面上部及び下部にヘッドラインのように使用すると良いのではないでしょうか?

又、英語を記号としてしか認識していない私のような人には動作デモがわかりにくいですが、「Bind mouse click and Enter keypress」と書いてある付近にマウスを持っていくと動作します。

尚、このようなテキストアニメーションは表示に時間がかかるため、メニューであったり何らかの説明のテキストに使用すると、ユーザのストレス増加に繋がるので注意が必要です。

K.Y

テーマ:システム開発 - ジャンル:コンピュータ

jQueryでcheckboxがcheckされてるかの値をとる
jQueryでcheckboxがcheckされてるかの値をとる 【Webtech Walkerより】
http://webtech-walker.com/archive/2010/04/06155654.html

当ブログでも何度も紹介しているJavascriptのライブラリのjQueryですが、CheckBoxにcheckされてるかどうかを判別するメソッドが用意されていません。

代わりの手段としては色々方法があるでしょうが、3つ程挙げられています。

素のHTMLエレメントから取得
var checked = $('#elem').get(0).checked;

is()で取得
var checked = $('#elem').is(':checked');

attr()で取得
var checked = $('#elem').attr('checked');

挙動としてはどれも変わらないので、好きな方法を使用するとよいでしょう。
しかし、元記事にもあるように「.checked()」は欲しい所ですね。



jQuery 日本語リファレンス
http://semooh.jp/jquery/

K.Y

テーマ:プログラミング - ジャンル:コンピュータ

JavaScript処理をバックグラウンドで実行する方法
JavaScript処理をバックグラウンドで実行する方法 【マイコミジャーナルより】
http://journal.mycom.co.jp/news/2010/03/30/010/index.html

Web WorkersというHTML5とともに策定が進められているJavaScript APIでは、Javascriptを同時作動する事ができるようになるようです。
実際のサンプルを示しつつ紹介されています。
デバッガによるトレースができなかったり、サポートされているブラウザが少ないなどといった理由で実際に使用される事はないでしょうが、数年後には普通に使用されると思われるので得て損はしない知識だと思います。
Firefox 3.7 Alpha 3では正しく動作するようなので、サンプルを試してみてはいかがでしょうか?(インストールしていない方も掲載されているスクリーンショットは必見)



Web Workersで遊んでみた 【nullpo.printStackTrace();より】
http://d.hatena.ne.jp/paulownia/20090718/1247935643

Web Workersを使いJavaScriptでバックグラウンド処理に挑む 【マピオンラボより】
http://labs.mapion.co.jp/blog/javascript/web_workersjavascript.php

K.Y

テーマ:システム開発 - ジャンル:コンピュータ

【Javascript】IE9、attachEvent不要
IE9、attachEvent不要 【マイコミジャーナルより】
http://journal.mycom.co.jp/news/2010/03/31/032/index.html

クロスブラウザの一つの重要な要素としてIE対応があります。(というか他のブラウザとIEではかかる時間が違いすぎ。)
その中でもイベント追加時の処理の対応ははよく行われる事だと思われます。

通常、イベント追加には「addEventListener」を使用するのですが、IEでは使用できないため「attachEvent」というIE独自実装された関数を使用する必要があります。
しかし、それぞれの関数内でthisの指す要素が違ったり、「attachEvent 」では追加されたイベントの順番がグチャグチャ(規則性なし)であったりと問題が多数あります。

しかし、IE9で「addEventListener」がやっと実装されるようです。
これで一つ、「だからIEは。。。」という呟く回数を減らす事ができますね。
ただ、当然IE6、7では「attachEvent」を使用せざるを得ないため、これらのブラウザの挙動をサポートする場合には依然必要なのですが。

余談ですが順番に関してはフレームワークでも吸収されていない場合がありますので注意して下さい。(prototype.js V1.6)



ハードウェアで高速化する HTML5: 開発者向けに最初の IE9 Platform Preview が公開 【Internet Explorer ブログ (日本語版)より】
http://blogs.msdn.com/ie_jp/archive/2010/03/18/html5-ie9-platform-preview.aspx

JavaScriptの動かないコード (中級編) 動的追加したイベントの実行順序 【主に言語とシステム開発に関してより】
http://d.hatena.ne.jp/language_and_engineering/20081011/1223680300

IE の attachEvent では this が使えない? 【ボッチが何か言ってるより】
http://d.hatena.ne.jp/hotch_botch/20080917/attachevent_this

これでできる! クロスブラウザJavaScript入門 【技術評論社より】
http://gihyo.jp/dev/serial/01/crossbrowser-javascript/0001

IEの腐ったEventを直す方法 【日本野望の会より】
http://yabooo.org/archives/122

K.Y

テーマ:プログラミング - ジャンル:コンピュータ

copyright © 2005 RIAトピックス all rights reserved.
Powered by FC2ブログ.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。