Automatic colored rows - Example for BiteSize StandardsBy using this site, you agree to the Privacy Policy and Terms of Use, and the use of cookies. If you do not consent to cookies please delete or disable them in your browser
memo.xight.org - リンクをマウスオーバーでサムネイルをポップアップ
Source function linkthumb(){ var nophoto = 'http://img.simpleapi.net/img/nophoto.gif'; var img = document.createElement('img'); img.src = nophoto; img.onmouseout = function(){ img.src=nophoto; img.style.display='none'; }; img.style.position = 'absolute'; img.style.cursor = 'pointer'; img.style.display = 'none'; document.body.appendChild(img); var d = document.getElementsByTagName('div'); for (var
川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ふったりク
Understanding AJAX
IntroductionAJAX, or Asynchronous JavaScript and XML, is a technique used to create dynamic and interactive web applications. Usually, it's mistaken as a technology, when in fact it's a method of using several different technologies together. What is AJAX?AJAX as a technique, allows a web page to update itself without requiring a full page reload. Furthermore, this is achieved by requesting the se
文字列外部化による JavaScript 高速化についての考察 - IT戦記
JavaScript において、文字列を外部化することで本当に高速化できるのかについて考察してみました。 まず、以下のコードを用いて IE 6.0 SP2, Opera 8.5, Firefox 1.5.0.1 でテストしてみます。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="ja" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Language" content="ja" /> <titl
Truncate HTML Text with JavaScript Automatically
Truncate Text with JavaScript Automatically This article describes what I think is a clever way of automatically truncating the text of a paragraph: Truncate the text to a length of your choosing Do not truncate in the middle of a word (only on a word boundary) Keep the page search-engine friendly by publishing the complete non-truncated text Add an ellipsis to the end of the truncated text Make t
length プロパティのパフォーマンス: Days on the Moon
「for 文 2.0」(IT戦記) では length プロパティの評価をループの外に出すことにより高速化を図っています。DOM の NodeList オブジェクト (document.getElementsByTagName() などで取得) や HTMLCollection オブジェクト (document.forms などで取得) の length プロパティは「生きている」(オブジェクト取得後の操作が反映される) 、すなわち誤解を恐れずいえば評価のたびに数えなおす必要があるので遅いというのも納得ですが、JavaScript のネイティブオブジェクトである配列の length プロパティはどうなのでしょうか。実際に調べてみました。 以下は 10000 個の span 要素に対する NodeList オブジェクトと配列の length プロパティのパフォーマンスを調べた結果です。数値は
for 文 2.0(笑) - IT戦記
まぁ、かなり知られてる話ですが JavaScript は .(ドット) の計算がかなり遅い。まぁ、簡単なスクリプトなら問題にならないが。web2.0的には大違いなのであります。ちなみに、.(ドット) の計算に比較演算の 3 倍のコストがかかる（IEはとくに）。 ということで、for 文は下のように(比較に .(ドット) を使わない)書くくせをつけましょう。地道な差が大きなパフォーマンスを生みます。 // for 文 2.0 for(var i = 0, len = array.length; i < len; i++) { .... }各種ライブラリの for 文 1.0 を for 文 2.0 化するだけで、CPU 使用率がけっこう下がりました。 予断ですが、間違っても .(ドット) を避けるために with 文を使うようなことはやめてください。 with 文のコストは 比較演算の 8
JavaScriptにおけるコントロール名としてのブラケット (大括弧) の利用 - memo.xight.org
Summary PHP で フォームの値を配列として受け取りたい場合， 以下のように記述するが，JavaScript で値を受け取る場合にちょっと面倒． <input name="hoge[]" /> <input name="hoge[]" /> name が hoge[0],hoge[1] ... の場合 <input name="hoge[0]" /> <input name="hoge[1]" /> JavaScript で hoge[1] の値を取得したい． 以下の場合，配列として認識されてしまう． document.forms[0].hoge[1].value; elements を用いて解決． document.forms[0].elements["hoge[1]"].value; name が hoge[],hoge[] ... の場合 <input name="hoge[
今日から使える 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
getter/setter メソッド - (new Hatena).blog()
オブジェクトの変数の状態について、「知る」・「設定する」の両方を行うメソッドを思いついたので、メモしておきます (まぁ多分良く知られてる方法なんだろうなとは思いますが)。 initialize: function () { this.__stack = false; }, prefer_stack: function (prefer) { return (this.__stack = prefer != undefined ? prefer : this.__stack); }具体的にどういう事かと言いますと、一般的なジョブの処理に関して、スタックとして処理するか、キューとして処理するかを、どのように設定したり知らせたりするのが良いか、ということを考えていたんです。 で、思いついたのが上の prefer_stack というメソッドです。 引数の有無によって、スタックとして「扱いたい」という
テキストエリアでリターンキーを押した際に、submitイベントの発生を抑止する方法 - Enjoy*Study
テキストエリアでのリターンキーで、submitイベントが発生しないようにする場合、ブラウザ毎にどのような処理を書けばいいのか調べてみました。(submitイベント自体に処理を追加せずに、テキストエリアでのイベントで制御したかったので) テキストエリアでのリターンを拾えるイベントとしては、下記の3つがあります。 keypress keydown keyup イベントをキャンセルする方法は、IEのJScriptの実装と、DOM 2のEventモデルでの実装である下記の2パターンを試しました。 event.preventDefault() event.returnValue=false そして確認の結果、上記のイベント×キャンセル処理の組み合わせでsubmitイベントがキャンセル出来るのは、下記のパターンとなりました。 IE 6 keydown - event.returnValue=false
川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
配列の先頭の要素を取得する - FAX
配列の先頭の要素を取得する 練習 var a = []; a[15] = 150; a[20] = 200; ok( void(0) === a[0]); ok( void(0) === a.slice(0,1)[0] ); ok( void(0) === a.shift() ); ok( car(a) == 150 ); function car(a){ for(var i in a) return a[i]; } Permalink | コメント(0) | トラックバック(0) | 08:20
IEBlog
Internet Explorer Team Blog We've moved! Find us at the new Microsoft Edge Dev Blog As we announced last week, with the reveal of Microsoft Edge we are archiving the IEBlog. Future... Date: 05/08/2015 Microsoft Edge is the browser for Windows 10 This morning, Joe Belfiore took to the stage at Build 2015 to share more about the next chapter in... Date: 04/29/2015 Announcing improvements to Enterpri
hbkr | Lightbox JSにフェードインエフェクトをかけてみる
Lightbox JSとscript.aculo.usを組み合わせてみた。 左のサムネイルをクリックしてみてください。大きな画像がふわーっとフェードインで表示されます（IEのバージョンによっては動かないぽい）。 やり方はとても簡単。 195行目付近に objLightbox.style.display = 'none'; new Effect.Appear(objLightbox, {duration:0.6}); てのと 224行目付近に objOverlay.style.display = 'none'; new Effect.Fade(objLightbox, {duration:0.6, afterFinish: function() {objLightbox.style.display = 'none';}}); てな感じのを適当に入れるだ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IT戦記 - Shibuya.js Technical Talk #1 を終えて。
codejanitor ≫ AJAX Timeouts with Prototype
[就職・転職] All About | 就職転職のノウハウ![[就職・転職] All About | 就職転職のノウハウ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8f530daf3cb408d6b6a0ba6f38ed7ccece36cffc/height=288;version=1;width=512/https%3A%2F%2Fimg.aacdn.jp%2Faa%2Fcommon%2Fogp300_300.png)
