Backstage of theater.js - *[prototype.js解読]
前回最後にHashクラスに言及したので見てみます。 【抜粋】 function $H(object) { return new Hash(object); }; var Hash = Class.create(Enumerable, (function() { if (function() { var i = 0, Test = function(value) { this.key = value }; Test.prototype.key = 'foo'; for (var property in new Test('bar')) i++; return i > 1; }()) { function each(iterator) { var cache = []; for (var key in this._object) { var value = this._object[key];
![Backstage of theater.js - *[prototype.js解読]](https://cdn-ak-scissors.b.st-hatena.com/image/square/06a15c64ba0ceec233d86d71001ebb29a9dcbf5d/height=288;version=1;width=512/https%3A%2F%2Fcdn.blog.st-hatena.com%2Fimages%2Ftheme%2Fog-image-1500.png)
JavaScript で日本語の変換途中の文字列を取得する
■ JavaScript で日本語の変換途中の文字列を取得する input form に onKeyDown とか指定してイベントを受け取るようにすると、現在入力している文字列が取得出来るわけですが、残念ながら日本語の変換確定前の文字列は IE でしか取得出来ません。 しかし setTimeout の処理とかを使えば IE 以外のブラウザでも取得出来るのですが、このやり方について解説している人を見掛けた事が無いので紹介しておきます。ええ、まぁ、実際にそんな事がしたい状況ってのはあんまり無いんですけどね。JavaScript で自動フリガナ入力 ってのを見たら、やっぱり onKeyDown のせいで IE 以外のブラウザには非対応っぽいので Firefox 対応版になったら嬉しいなと思ったもので。 それで肝心のやり方ですが、実際にサンプルを見た方が早いと思うので、以下に用意しました。何も難し
GIGAZINE - いろいろな効果を追加できるJavaScriptライブラリ「jQuery」
ファイルサイズわずか10キロバイト、CSSの1から3、XPathをサポートし、Internet Explorer、Firefox、Safari、Operaで動作します。「JavaScriptのコードを書くのが楽しくなる」というのがモットーらしい。 ダウンロードや実際の例、使い方などの各種取り扱い説明は以下の通り。 jQuery: New Wave Javascript http://jquery.com/ 上記ページの「Run」をクリックするとその機能の一端を垣間見ることができます。面白い効果です。 その他のデモとしてはこんな感じでいろいろなところに使えます。特に一番下の「Example G」のボタンをクリックしてから本文の上にマウスを乗せると色が変わり、フェードしながら元に戻るというのはシンプルながら面白い。 JQuery http://codylindley.com/blogstuff
Speeding up Prototype’s Selector
While working on the future AJAX interface of jamendo, I ran into some performance problems that were due to the extensive use of the new Prototype 1.5 function, $$. (Announcement of $$ on Ajaxian) Prototype’s current code is quite elegant (as always!) but very slow, so I wrote an add-on that makes this function up to 20 times faster in most usual cases (tested on IE6, Firefox 1.5 and Opera). Don’
要素をキャッシュして $ 関数をちょっと高速化 - IT戦記
prototype.js の $ 関数で あっちこっちで、$、$、ってやるとその都度ノード探索発生してうざいので ↓prototype.js 1.5 の $ 関数 function $() { var results = [], element; for (var i = 0; i < arguments.length; i++) { element = arguments[i]; if (typeof element == 'string') element = document.getElementById(element); results.push(Element.extend(element)); } return results.length < 2 ? results[0] : results; } キャッシュしてみますた。 でも、IDがダイナミックに変更される場合(あんまな
和人 - [javascript] TextBoxWatermark
Atlas.NET覗いていたら、テキストボックスに入力してもらいたい内容を表示しておき、フォーカスがあたると消すというデモンストレーションが載っていた。 http://atlas.asp.net/atlastoolkit/TextBoxWatermark/TextBoxWatermark.aspx 英名で「Watermark」、「すかし」なんていう意味もあるようだ。 これくらいなら実装できるかなと思ってJavaScriptを書いてみた。 ライブラリとしてprototype.jsを使ってます。 TextBoxWatermark = Class.create(); TextBoxWatermark.prototype = { initialize: function(element) { this.element = $(element); this.options = Object.exte
![和人 - [javascript] TextBoxWatermark](https://cdn-ak-scissors.b.st-hatena.com/image/square/016c0c3d293226a19c96d0f011de034a11b9bcfe/height=288;version=1;width=512/https%3A%2F%2Fogimage.blog.st-hatena.com%2F17680117127102563026%2F17680117127102564672%2F1556764825)
Script.aculo.us の Effect をちょっと簡単に書く方法 - IT戦記
普通はこういう風に書く new Effect.Opacity($('id'), {from: 1, to: 0});こういう、インスタンスを取得しない new は JavaScript では一般的に使われる。 関連するプロパティを this にまとめ、イベントを this に bind して分かりやすくするためである。 でも、慣れてないと逆にわかりにくい。 それで、最近のScriptaculousではこう書ける。 $('id').visualEffect('opacity', {from: 1, to: 0});こっちのが、ちょっとイメージ掴みやすいですよね。 ついでに、こんな書き方も出来るかも！(未検証) <a href="javascript:void(0);" onmouseover="Element.extend(this);" onclick="visualEffect('opa
川o・-・）＜2nd life - prototype.js 1.5 からの新機能 Template の使い方
JavaScript での変数を使った文字列の作成は何かとめんどくさいですね。prototype.js では 1.5_pre0 から Template という簡易テンプレートとして使えるクラスが加わりました。相変わらずドキュメントはソースと test 嫁なので簡単な使い方を紹介します。 まずは Template となる文字列を new Template で作ります。Template のリテラルは #{}です*1 。 var t = new Template('#{foo}, #{bar}!');次に作成した Template インスタンスの evaluate 関数を呼び出し、引数として Hash(Object) を渡します。 t.evaluate({ foo: 'hello', bar: 'world' }); // hello, world!もしテンプレートを使い回さず、一度限りの文字列
inforno :: $$で属性セレクタ
これはかなり嬉しい機能だなあ。 最近Prototype.jsの$$で属性セレクタが使用できるようになりました。 どんな風にかけるのか、コードをテストから引っ張ってきてみました。 1$$('a[href="http://inforno.net/#"]') 2$$('a[class~=internal]') 3$$('*[xml:lang|="es"]') 4$$('*[xml:lang|="ES"]') 5$$('a[href!=#]') 6$$('div[style] p[id] strong') 7$$('a[class~=external][href="http://inforno.net/#"]') こんな感じです。 値はクオートしてもしなくても大丈夫っぽいですね。 すばらすい。inputに対する操作なんかで特に便利。今までちょっとボタン操作するためだけに、そのボタンにIDふったりク
今日から使える JavaScript カスタム関数トップ 10
今日から使える JavaScript カスタム関数トップ 10 2006-02-13-2: [JavaScript] - Top 10 custom JavaScript functions of all time http://www.dustindiaz.com/top-ten-javascript すぐにでも使える，気の利いた JavaScript の関数を 10 個紹介． - 10) addEvent() イベントリスナーを登録する関数．クロスブラウザ対応．結構有名． - 9) addLoadEvent() クロスブラウザな window.onload．onload する関数が幾つもある場合に． - 8) getElementsByClass() クラス名から要素を取得する関数．prototype.js にも getElementsByClassName() という名前である． p
川o・-・）＜2nd life script.aculo.usのファイルサイズを軽減
http://www.goodpic.com/mt/archives2/2006/02/ajax.html で紹介されてる通り、script.aculo.usは通常のロードではファイルサイズが100KBを超えます。しかし、それはフルでロードしたときの容量なのです。script.aculo.usはロードするパッケージを選ぶことができる*1ので必要な機能だけを選べば良いのです。例えば、たいていの場合はscript.aculo.usのeffects.jsだけしか使わなかったりするので <script src="/js/scriptaculous.js?load=effects" type="text/javascript"></script> とすればOK。これでファイルサイズは34KBに収まります。また、二つ以上のパッケージを選択したい場合は <script src="/js/scriptac
memo.xight.org - JavaScriptのデバッグ方法
Venkman JavaScript Debugger FirefoxのExtention． JSUnit メソッド 内容 assert([コメント], booleanValue) assertTrueと同じ assertTrue([コメント], booleanValue) booleanValueがtrueか assertFalse([コメント], booleanValue) booleanValueがfalseか assertEquals([コメント], value1, value2) value1 == value2か assertNotEquals([コメント], value1, value2) value1 != value2か assertNull([コメント], value) value == nullか assertNotNull([コメント], value) value
prototype.jsのものすごく簡単な使い方。 : blog.nomadscafe.jp
prototype.jsのものすごく簡単な使い方。 はてなダイアリーの方にprototype.jsでHTMLを汚さないロールオーバースクリプトというエントリーを書いたのだが、prototype.jsの入手方法やらすごく簡単な使い方がないようなので、書いてみます。 prototype.jsはJavaScriptのライブラリ（中身はJavaScriptです)で、これを使うとJavaScriptを組むのがかなり楽になるというものです。話題のAjaxのプログラミングも簡単にできます。 ライブラリは、 http://prototype.conio.net/ からダウンロードできますが、TOPページにあるファイルはちょっと古いものなので、Browse the darcs repositoryというリンクを辿り、 http://dev.conio.net/repos/prototype/dist/ から
TechTarget - Global Network of Information Technology Websites and Contributors
Looking for information about Informa TechTarget products and services? The commercial homepage has moved. Visit Informa TechTarget News 01 Aug 2025 / Policy & regulation Trump urges top drugmakers to cut U.S. prescription drug costs Trump increases pressure on 17 of the world's largest drug makers to lower U.S. prescription drug prices in 60 days, ahead of proposed tariffs and pharmaceutical impo
#!shebang.jp : Yellow Fade Technique
November 14, 200515:50 Yellow Fade Technique カテゴリ技術ネタ 最近、よく見かけるので prototype.js 使って実装してみる。 fat.js ってもっと便利なやつもあるけど、単純にやってる事がよく分かるように実装してみたつもり。 エフェクトをかけたい要素の id を指定して、 <script type="text/javascript"> new Fade('id'); </script> みたいな感じで使う。 var Fade = Class.create(); Fade.Colors = ['#ffff99', '#ffffaa', '#ffffbb', '#ffffcc', '#ffffdd', '#ffffee', '#ffffff',]; Fade.prototype = { initialize: function(eleme
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Larafast