8月17日の技術勉強会 - Flexレイアウト手書き勉強会 8月17日に行われました技術発表会の内容を撮影した動画ファイル/資料を公開いたしました。内容は以下のとおりです。 テーマ Flexレイアウト手書き勉強会 発表者 d:id:secondlife 勉強会動画 ダウンロード…
Devthought - Guillermo Rauch’s Blog TextboxList meets Autocompletion In my previous blogpost I explained how to extend TextboxList to add closing functionality via a link added to each box. But it was missing an important ingredient: autocompletion! 超クールな複数アイテムの入力補完用JavaScriptライブラリ。 テキストボックスにアイテムを入力すると、クールに補完候補が表示され、補完した後は、1つのアイテムとして、水色の枠で囲まれ、×ボタンで消すことも出来る模様。 デモはこちら アイテムを複数入力する必要のある、ソーシャルブックマークでのタ
[追記]id:zorioさんのブックマークコメントの指摘により、抜けていた「.apply」を挿入しました。[/追記] JavaScriptで、大域変数(大域オブジェクトのプロパティ)fooが存在しないときに何かをしたいとしましょう。例えば、こんな書き方をしますよね。 if (!foo) { // 何か } でも、式 !foo は、fooがnullでもfalseでも0でもtrueに評価されます。 if (foo == undefined) { // 何か }としたほうがよさそうです。が、null == undefined もtrueとなるのであまり改善されてません。 if (foo === undefined) { // 何か }イコールが3つなら、厳密に「fooが未定義値であるとき」を表現します。ここで、undefinedはリテラルではなくて、仕様として事前に定義されている大域変数です。u
Datejs - A JavaScript Date Library About… Comprehensive, yet simple, stealthy and fast. Datejs has passed all trials and is ready to strike. Datejs doesn’t just parse strings, it slices them cleanly in two. 日付を好きな形で入力でフォーマット済みの日付に変換してくれるJSライブラリ「Datejs」。 today とか tomorrow とか last April とかの形式で入力すると、「Monday, November 26, 2007 0:00:00 AM」の形に変換できます。 日付の変換コードは次のような感じ。 // Convert text into Date Date.pars
MooTools Mocha UI Mocha is a MooTools user interface class made with canvas tag graphics. This is an on going exercise to help me become more familiar with both MooTools and the canvas tag. 軽快かつクールなページ内小窓作成用ライブラリ「Mocha UI」。 次のような移動&リサイズ&クローズ&最大化可能なウィンドウを簡単に作成できます。 サイト内のデモでは、タイトルと内容を入力することで、動的にウィンドウを作成できることが紹介されています。 フレームワークには、mootools 使用。 かなり軽快に動いてくれ、ページ内で別窓を作るUIを作る際にはかなり使えそう。 関連エントリ Prototype.jsベ
オンラインで汚いJavaScriptコードを整形できる「Online beautifier for javascrip... 次の記事 ≫:ブラウザ上で動くJavaScriptの統合開発環境「TIDE」 Spookies Labs | シンプルな日付選択用ライブラリ「protocalendar.js」を公開しました prototype.js ベースの日付選択用 javascript ライブラリ「protocalendar.js」を公開しました。 日本語表示できる国産の日付選択用JSライブラリ「protocalendar.js」。 特徴は次のようになってます。 prototype.js ベース(1.5 以降)。 シンプルで軽量。 MIT LICNESE 16のローカライゼーションに対応。 フォーカスでカレンダー表示。(トリガーを追加可能) 日付フォーマットを変更可能。 日付のラベル表示が可能
軽快なWebページを実現するにはYSlowなどの分析ツールを使って問題点を洗い出し、対策をとる方法が便利だ。軽快化にはいくつもの方法があるわけだが、なかでももっとも簡単で基本的な方法がページで使っているCSSやJavaScriptのコードを圧縮することである。すでに圧縮ツールとしてはJSMinやDojo compressor、YUI Compressorなどがある。 しかし逆はどうだろう。圧縮されたJavaScriptを逆に見やすいソースコードに展開しなおすツールがあってもいい。自身が作成したソースコードの整形や、Webページで利用されているJavaScriptソースコードの解析に利用できる。ここではそんなツールとしてEinars "elfz" Lielmanis氏の開発した「JS Beautifier」を紹介したい。 整形前のJavaScriptソースコード JS Beautifierで
先日、MozillaでECMAScript(JavaScript)の仕様を作っているJohn Resigさんが来日しました。 その際、1時間ほどのQ&Aの司会と、ライトニングトークでの発表を私させていたただきました。 その際、基調講演をしてくださった、etoさん(http://eto.com/d/PresenForJohnResig.html)のコメント。 こないだのJohn Resigによる講演の後に一緒に飲んだんですけど, その席で聞いた話がすんごく面白かったな. いろいろ面白かったんだけど,特にjquery2が面白かった. http://ejohn.org/apps/jquery2/ このURLなんですけど,コードはこんな感じ. <script src="http://jquery.com/src/latest/"></script> <script src="parse.js"><
JavaScript-XPath とは JavaScript-XPath は、 DOM 3 XPath を実装していないブラウザに対して、実用的な速度で動作する DOM 3 XPath のエンジンを追加します。 一言で乱暴に言ってしまえば、どのブラウザでも document.evaluate って関数で XPath 使えるようになるよ!ってことです。 以下が公式サイトになります。 http://coderepos.org/share/wiki/JavaScript-XPath DOM 3 XPath ってなんなの!? めっちゃ簡単(で、ちょっとだけ適当)なDOM 3 XPath の説明をします><。 JavaScript でよく使う document.getElementById や document.getElementsByTagName って関数ありますよね? DOM 3 XPath
「増大サプリについてよくわからない」 「増大サプリって種類が多いからおすすめがわからない」 「増大サプリを購入する時、確認するべき他の商品との比較点」 このように増大サプリを購入する際はいろんなことで頭を悩ましがちです。 このページでは上記のような悩みを解決していきます。 増大サプリについて初心者の方はもちろん、少し知識がある方にも「なぜこのような考えになるのか」などの理由も含めて解説していきます。 増大サプリ40選ランキング 増大サプリとは何か 増大サプリには増大に必須と言われているシトルリンやアルギニンなどのアミノ酸、亜鉛といったビタミン・ミネラル系成分、コブラやスッポンといった動物系成分、マカやガラナのような植物系成分などが配合されています。 上記で挙げたような増大に必要な成分はもちろん体に良い影響を与えてくれる成分も手軽に摂取できるのも増大サプリの特徴です。 増大サプリに配合されて
Ext JSとprototype.jsで作るリッチなUI:パターンとライブラリで作るAjaxおいしいレシピ(3)(1/4 ページ) 今回は話題のExt JSを使ったサンプル Ext JSはAjaxアプリケーションを構築するためのJavaScriptライブラリ(フレームワーク)です。Ext JSを使用することで、デスクトップアプリケーションのようなユーザーエクスペリエンスを提供できます。2007年10月11日に2.0のベータ版がリリースされ大変注目を集めました。 今回はそのExt JS 2.0のベータ版を使ったサンプルを紹介していきます。 ■ ごく普通の入力フォームのサンプル まずこちらのサンプルを見てください。 今回のサンプルプログラム(拡大表示はこちら、※注意1:FireBugを有効にしている場合は動作が重くなる場合があります。一時的にFireBugをオフにして利用されることをおすすめし
Prototype UI Prototype UI is a javascript library based on Prototype 1.6 and script.aculo.us. It's a library of UI components used by many web applications. Prototype.jsベースのUIライブラリ「Prototype UI」。 Prototype UI は、主にUIに関する機能を提供するライブラリで、次の機能が含まれるようです。 スキン、ドロップシャドウ、ダイアログ等の効果を与えたウィンドウ作成機能 カルーセルウィジェット ドックウィジェット シャドウエフェクト 現在、ライブラリの利用はSVNリポジトリからの直接の取得だけとなっているようです。 また、チェックアウトしても、まだ動作しないようですが、次のような動作機能テストのドキ
最近のWebサイトでは画面遷移をなくし、Ajax化するのが好まれる。とは言え、既存のサービスに対して実装するのはそうそう単純ではない。それにAjaxを使った場合、PVの計測が難しく、メディア等では取り入れづらい。 だが、これを使えば簡単にそれっぽい実装ができそうだ。 今回紹介するオープンソース・ソフトウェアはGreyBox、Webページにも対応したCSSポップアップウィンドウだ。 GreyBoxは最近良く見かける、画像をクリックすると同じページ上でポップアップするライブラリになる。特徴的なのは、画像のみならずWebページでもポップアップしてくれる点だ。 既存のAタグに対して情報を埋め込めば、それだけでクリックすると背景をグレーアウトし、クールなポップアップを表示してくれる。これならばお問い合わせフォームや、詳細検索等のフォームでも使えそうだ。 大きさを指定したり、フルスクリーンでの表示もで
(Last Updated On: 2007年10月12日)私が知らなかっただけかもしれませんが、これにはかなり驚きました。いろんな所で問題が指摘されていますが、ECMAScriptにXML機能を追加したのはどうなんでしょうね…. 確かにかなり便利なのですが以下のコードでスクリプトが実行されることはほとんど知られていないでしょうね。 <script> 123[”+<_>ev</_>+<_>al</_>](”+<_>aler</_>+<_>t</_>+<_>(1)</_>); </script> 好むと好まざる関係なくFirefox 1.5から使えるのでWeb開発者は知っておかなればならないです。 日本語訳 http://www.ne.jp/asahi/nanto/moon/specs/ecma-357.html 原文 http://www.ecma-international.org/pu
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
Webページ上でグラフを描くというと、各種画像生成ライブラリを利用するだろうか。画像は手軽な反面、ダイナミックな生成ができず面倒な場合がある。 ダイナミックに描画を変更できると言えば、JavaScriptが便利だろう。そのようなニーズではこれを試してみよう。 今回紹介するオープンソース・ソフトウェアはLT Diagram Builder、JavaScriptベースのグラフ生成ライブラリだ。 LT Diagram Builderが対応しているのは棒グラフ、折れ線グラフ、関数グラフ、矢印、円グラフ、ガントチャート等多彩な描画に対応している。 ダイナミックな描画にも対応しており、関数の値を変更すれば、即座にグラフに反映する事ができる。JavaScriptの強みだろう。 また、PHPやASPでのグラフ生成にも対応している。結果的に出力されるのはJavaScriptのようだが、サーバサイドのデータを
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー!古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
HTMLテーブルに分かりやすいカーソルハイライト機能を付けられるJSライブラリ「Tablecloth」 2007年10月10日- Welcome to Tablecloth Tablecloth is lightweight, easy to use, unobtrusive way to add style and behaviour to your html table elements. HTMLテーブルに分かりやすいカーソルハイライト機能を付けられるJSライブラリ「Tablecloth」。 テーブルにカーソルを合わせると次のように、現在位置がハイライトされます。クリックすると、その位置のハイライトを固定します。 シンプルな効果ですが、データが多くある際、現在位置の確認や、チェックしておきたい部分をハイライトさせておくことが出来るなど、ユーザビリティ向上が期待できますね。 使い方は次
前回のエントリがブックマークしてくれた人が多かったので嬉しくなって作ってみました。 テンプレートエンジンはAjaxPagesを前は使ってましたが、サーバのレスポンスが悪いとテンプレートをロードする前に表示しようとしてエラったので、自分好みのテンプレートエンジンを作りました。 特徴 Javascriptでテンプレートが使える 外部ファイルが使える(タイムアウトも設定できる。) 文字列をテンプレートとして使える JSPっぽい書き方が出来る テンプレートが展開された内容が確認できる!デバック簡単!(かもしれない) ライセンスがMITで使い放題 サンプルとダウンロード jsTemplate 使い方 jsTemplate('sample01.jshtml') // 読み込み エラーがあれば通知 .load(function(e){ alert('error '+e); }) // レンダリング .r
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く