IDEA * IDEAドットインストール代表のライフハックブログ
複数のCSS/JavaScriptを結合＆圧縮·phpFlair MOONGIFT
phpFlairはPHP製Webベースのオープンソース・ソフトウェア。jQueryなどのJavaScriptフレームワークやCSSフレームワークを用いていると、ついつい一度のアクセスで多数のコネクションが張られるようになる。これではサーバの負荷はもちろんクライアントでも表示が遅くなってしまう。 利用するサンプル（公式サイトより） そこで考えたいのがJavaScript/CSSファイルをそれぞれ結合して一度のアクセスで済ませてしまう方法だ。手作業でもできるが、メンテナンスを考えると自動処理の方が便利そうだ。phpFlairを使えばそれを簡単に実現できる。 phpFlairはPHPで作られているのでPHPを使ったプロジェクトでは手軽に導入できそうだ。JavaScriptファイルやCSSファイルを表示する際にphpFlairを経由して呼び出すことでキャッシュしたり、レスポンスのヘッダにもキャッシ
ついに！iPhoneでもFlashが表示できるライブラリ·Gordon MOONGIFT
GordonはJavaScript製のオープンソース・ソフトウェア。iPhoneの最大の欠点とされるのがFlashの表示が未対応という点だ。それによって利用できないサイトがいかに多いことか。今しばらくはAppleの対応は見込めないとあって、我慢の日々が続くだろう。 アニメーションにも対応している だがただ指をくわえて待っていても意味がない。技術者たるもの無理といわれているからこそ挑戦する価値があるのだ。そして一部において問題を乗り越え、見事iPhoneでもFlashを使えるようにしたのがGordonだ。決めてはFlashのSVG化だ。 単なるドローの表示はもちろん、アニメーションについても一部対応している。描画は元のFlashファイルとほぼ変わらず、とても良好な結果だ。もちろん動画や音楽を再生するようなプレーヤレベルはできないが、将来的にはFlashバナー程度ならいけそうだ。 iPhone
JavaScriptを使わずにmixiアプリを作る！·mist.js MOONGIFT
mist.jsはJavaScript製/jQueryを使ったオープンソース・ソフトウェア。OpenSocialによってSNS上で実行できるアプリケーション環境が増えてきた。日本ではmixiやGooが有名なプレーヤになるだろう。実際に作ってみたいと考えている企業、個人も多いはずだ。 サンプルより。マイミクを取得する アイディアはあっても、プログラミングが苦手で参加を躊躇してしまっている…という人がいるかも知れない。そんな方はまずはmist.jsからはじめてみてはいかがだろう。mist.jsはなんとJavaScriptすら使わずにmixiアプリが開発できるフレームワークだ。 タネを言えばJavaScriptの代わりにmist.jsが定義する方式に則って記述することで、データの取得周りを隠蔽できるということだ。とはいえ取れるデータは多い。OWNER/VIEWER、マイミク、IDで指定してユーザ情
JavaScript の配列と連想配列の違い - IT戦記
id:cheesepie:20070131:1170172709 最近は、こういう風に JavaScript を勉強する人が増えていてとても嬉しいです ＾＾ id:cheesepie さん頑張ってください！ で、ちょっと配列と連想配列の使いかたが違うようなので、エントリーを書こうと思いました。おせっかいだったらすみません＞＜ ！ やっぱり、このへんが JavaScript の難しいところのひとつなのだろうか。 ということで、 JavaScript の配列と連想配列の違い いってみよおー 連想配列とは JavaScript では連想配列は一番シンプルなオブジェクトのことである。つまり、すべてのオブジェクトは連想配列である。 以下のすべての連想配列はまったく同じものである。 // 1 var obj = { hoge: 'hoge' }; // 2 var obj = { 'hoge': 'h
javascriptプログラマのレベル10 : tech.kayac.com - KAYAC engineers' blog
週末料理をしていて足を切ってしまいました。agoです。 以前Perlは書いていたんですが、その頃以下の記事を読んで非常に感銘を受けました。 Perlプログラマのレベル10 - Perlプログラミング救命病棟より - naoyaのはてなダイアリー 当時あまりコミュニティとのつきあいがなかったので、「自分のスキルの絶対位置」、「次のレベルへ行くために必要なもの」を知ることで非常に安心感を感じた記憶があります。 いま確認したところ、「JavaScriptプログラマのレベル10」はないようなので書いてみました。 Perlプログラマ Schemeプログラマ Rubyプログラマ （本家に直接リンクできるURLが無かったため、参照ページへリンクしています） haskellプログラマ 堕落したCプログラマ HTML知識レベル プログラマレベル 企業法務 JavaScriptの業務スキルレベル 判別表 （５
Chapter.2 JavaScriptの記述ルール - Pescatora Webリファレンス
JavaScriptの実装方法 JavaScriptをXHTML（HTML）の中に記述するにはいくつか方法があります。 XHTML（HTML）にJavaScriptを記述 まず、XHTML（HTML）の中にJavaScriptを直接書くにはscript要素を使用します。開始タグの『<script type="text/javascript">』から終了タグの『</script>』までがscript要素となります。その要素の中にJavaScript文を記述していくのです。 <html> <head> <title>JavaScriptの記述方法</title> </head> <body> <script type="text/javascript"> document.write("XHTML（HTML）にJavaScriptを記述します。"); </s
Box2DJS - Physics Engine for JavaScript
Left-click to create an object. Right-click to show next example. What's this Box2DJS is a JavaScript port of Box2D Physics Engine. To tell the truth, this is converted from Box2DFlashAS3_1.4.3.1 in an automatic manner. (The reason why not Box2DFlashAS3_2.0.0 based is simply because I overlooked the renewal.) How to use Download a zip file and extract it. Copy js/ and lib/ directories from the ext
Javascriptの圧縮と難読化 : ええもん屋 ラボ
Amazon E-Commerce Service(ECS4.0)、Javascript(Ajaxを含む)の技術についての話題。 ECS4.0関連のライブラリやツールの提供もしています。たまに独り言も・・・ ここで言うJavascriptの圧縮とは、内部変数の簡略化、コメントの削除、余計な空白の削除等を行う事でJavascriptのファイルサイズを小さくする事を指します。上記の処理をすることで、結果的にソースの難読化も行えます（変数が"_1"とかになれば読みにくいですよね）。 通常ＨＰで使うJavascriptは大規模なものにならない場合が多いので、必要ないと思われるかもしれませんが、全く同じ動作をするならできるだけソースが軽い方がいいと思いませんか？そこで今回紹介するのは、ソース圧縮のプログラムcustom_rhino.jarです。ソースにもよりますが、４０％～６０％くらい圧縮できます。
イベントのkeyCodeとcharCode - hogehoge @teramako
イベントのキーコードの取得には event.keyCode event.charCode の二種類があるんだが、keypressイベントとkeydownイベントとで出方が違うことに気付いた。 keypressとkeydownの表す数値は以下の通り keyCodeにはキーを表す特殊コードを表す数値として出る*1 charCodeにはASCII文字コード表に対応した10進数として出る 以下に幾つか試した結果を書くので参考に。ただ、特殊キーに当たりそうな(ex. windows,無変換, IMEオン時の挙動)ものは環境によって異なりそうなので注意。 keypress ASCII文字コードとして認識できるものはcharCodeに出る そうでないものはkeyCodeに出る IMEオン時にイベントが挙がることは期待できない((keyCodeに229で挙がる時と挙がらない時があった)) 押したキー ch
JavaScript: 世界で最も誤解されたプログラミング言語 - 実用
翻訳 原文:JavaScript: The World’s Most Misunderstood Programming LanguageCopyright 2001 Douglas Crockford. All Rights Reserved Wrrrldwide. JavaScript(別名：Mocha、LiveScript、JScript、ECMAScript)は、世界で最も人気のあるプログラミング言語の一つです。世界中のほとんどのパソコンには、少なくとも1つはJavaScriptインタープリタがインストールされ動いていることでしょう。JavaScriptは、WWWのスクリプト言語としての確かな地位により広く利用されるようになったのです。 しかしその高い普及率にもかかわらず、JavaScriptが汎用的でダイナミックな優れたオブジェクト指向プログラミング言語であることはあまり知られて
[ThinkIT] 第3回：YUIライブラリと外部JSの呼び出し手法 (1/2)
「第２回：jQueryライブラリの内部とonloadイベント記法」で解説したPrototypeとjQueryはどちらも個人がリリースするライブラリでしたが、今度は、より規模の大きなライブラリの事例をご紹介します。Yahoo! UIライブラリ（YUI）は、米国Yahoo!がBSDライセンスで提供するJavaScriptライブラリです（図3、注5）。 個人だけでなく、YUIのように大手企業もライブラリを公開する事例が増えてきています。YUIでは、Ajaxやイベント管理といった基本機能に加えて、アニメーションやドラッグ＆ドロップ処理のユーティリティ、さらにカレンダー／ツールチップ／ダイアログ／タブ表示／ツリー表示といった豊富なウィジェットが提供されているのが特徴です。 YUIは、表3に示す14のモジュールで構成されています。 モジュール名 主な用途
JavaScriptコーディングに関するテクニックやパフォーマンス等のリファレンス集:phpspot開発日誌
最近発見した、JavaScriptコーディングに関するテクニックやパフォーマンス等の参考になりそうなエントリをリファレンスをまとめてみました。 Avoiding Problems With JavaScript’s getElementById Method in Internet Explorer 7 | Impressive Webs IE7のgetElementByIdで起こる問題を避けるためのTIPS集。 How to add a CSS Link programmatically using JavaScript <link>タグをJavaScriptによって動的に作成してCSSを動的に設定するコード例 JavaScript CSS Selector Benchmarks CSSセレクタでDOMにアクセスする際の各フレームワークでの速度ベンチマーク比較 6 Ways To Wor
HTML/JavaScript/CSSをシェイプアップ！·Patu Digua MOONGIFT
HTMLやJavaScript、CSSを構造化して見やすく書こうと思うとインデントやスペースを使うだろう。確かに見やすいが、ブラウザへのレンダリングを行う上では特に意味はない（中には意味のあるスペースもあるが）。できるだけ転送量を抑えようと思うと、このスペースをなくしていくという作業が大事になる。 HTML/JavaScript/CSSのサイズを軽減 そのためのツール（難読化ツール）はいくつか存在するが、HTML/JavaScript/CSSのいずれにも対応したものは多くない。そこでPatu Diguaだ。 今回紹介するオープンソース・ソフトウェアはPatu Digua、HTML/JavaScript/CSSからスペースやコメントを排除するソフトウェアだ。 Patu DiguaはJavaで作られたソフトウェアで、Windows/Mac OSX/Linuxで動作する。指定したファイルからコメ
jQueryで実装する進捗グラフ付き複数ファイルアップローダー:phpspot開発日誌
Multiple File Upload With Progress Bar Using jQuery jQueryで実装する進捗グラフ付き複数ファイルアップローダー。 次のようなマルチファイルアップローダーが実装できるjQuery＋PHPなソースが公開されています。 アップロード部分には swfupload を使っているみたい。 サイトではjQueryを使っていて、こういう機能を実装したいという場合に覚えておくと使えるかも。 関連エントリ jQueryでチェックボックスをすごい形にカッコよくしちゃう方法 jQueryでリアルタイムにCSSを書き換えるサンプル jQuery用のGUIコンポーネントプロジェクト「mbideasproject」がすごい ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集
第1回 jQueryにふれる | gihyo.jp
はじめに ここ数年、JavaScriptライブラリを使ってサイトを製作するという機会がどんどん増えてきました。今まででであれば、JavaScriptのライブラリを使う・使わないに関わらず、その製作の多くはプログラマーの方が行っていたと思います。しかし近年、そのJavaScriptライブラリも種類が増えてきて、プログラミングの知識がなくても簡単に導入できるようなライブラリも出てきました。そのため、それらの使い手はプログラマーからWebデザイナーやマークアップエンジニア側へとシフトしつつしている部分もあります。 そんな数多くあるJavaScriptライブラリの中でも、Webデザイナーなどのプログラミング知識がない人でも比較的導入のしやすいのが『jQuery』です。このjQueryの魅力は、その使いやすさとプラグインの豊富さにあり、プラグインだけでも、すでに使ったことがあるという方も多いと思いま
ファンシーなデザインがいい感じのAjax＆PHPなコンタクトフォーム作成サンプル:phpspot開発日誌
A Fancy AJAX Contact Form ? Tutorialzine ファンシーなデザインがいい感じのAjax＆PHPなコンタクトフォーム作成のチュートリアルと、ソースコードが公開されてます。 次のようなデザインで、入力値にエラーがある場合のバリデーション機能とヒントのポップアップ機能が付いてます。 ヒントのポップアップが影付きなど、デザインがなかなか優れているのがいいですね。 CSSベースなので、デザインの変更も容易です。 関連エントリ シンプルなActionScript3で出来たコンタクトフォーム PHPとAjaxを使ったリアルタイム値チェック機能付きコンタクトフォーム「LightForm」 Ajax＆PHPでアニメーションするコンタクトフォームを作成するサンプル
jQueryでQueryStringをパースして配列で受け取れる便利関数:phpspot開発日誌
jQueryでQueryStringをパースして配列で受け取れる便利関数が公開されていました。 hogehoge?a=b&c=d&e=f の ? 以降のQueryStringを {"a":"b", "c":"d", "e":"f" } といった配列で簡単に受け取れます。 次のような関数によって実現しています。 function getUrlVars() { var vars = [], hash; var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); for(var i = 0; i < hashes.length; i++) { hash = hashes[i].split('='); vars.push(hash[0]); vars[hash[0]] = ha
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Site Under Maintenance
JavaScriptでの正規表現を覚えたいときに激しく使えるチートシート - IDEA*IDEA ～ 百式管理人のライフハックブログ
