注意: このページは最後に更新されてから 1333 日が経過している記事です。 文章が腐敗している可能性があります。その点を考慮した上で確認ください。

Javascript

提供: kimoto's wiki

概要

nothing

Android2.3のバグ

position:fixedな固定ヘッダーを、Javascriptでposition:absoluteにして、そのあとposition:fixedにしたときに、CSS3アニメーションが有効にならない。

CSS3アニメーション

だいぶ楽

$("#target").css('-webkit-transform', 'translate3d(25px, 0px, 0px)');
$("#target").css('-webkit-transition', '-webkit-transform 200ms cubic-bezier(0,0,0.25,1)');

ってやるとDOMの #target オブジェクトをX方向に25px移動させることが出来る。しかもなんかjsでsetTimeout使いまくって実装するよりアニメーションがなめらかでキレイ。

jQuery

生?のevent使う方法

e.originalEventっての使うと見れる!

$("#hoge").bind('click', function(e){
  console.log("original event: %o", e.originalEvent);
});

スクロール位置取得/設定

value = $(window).scrollTop(); // 取得
$(window).scrollTop(1); // 設定

ブラウザのデフォルト動作をしないようにする

例えばスクロールイベントとかそういうの潰すとそれはできなくなる

event.preventDefault();

引数をハッシュで渡すような関数作るときのイディオム

  function do_task(customOptions) {
    var defaultOptions = {
       key1: "value1",
       key2: "value2"
    };
    var options = $.extend({}, defaultOptions, customOptions);
    alert(options.key1); // alert1!
    alert(options.key2); // alert2!
  }
  do_task({key1: 'modified value'}); // こんな感じでkey1のパラメーターだけ書き換えできるようになる

親ウインドウを閉じたり、親ウインドウの関数呼び出したり

window.opener.close();
window.opener.myFunc();

などとする。今まで開いたウインドウを、孫ウインドウにあるボタンで全部閉じつつ、最初のページをリロードするサンプル: http://kymt.me/src/html/window/page3.html