背景画像にLazyload。
背景画像にLazyLoadをあてれるのかと思って試してみたところ、普通に出来るようでした。
背景画像にLazyLoadをあてれるのかと思って試してみたところ、普通に出来るようでした。
メモ代わりに。 jsでfunction_existsのように関数が定義されているかチェックします。
最近見かける事が多くなったjquery プラグイン、またgithubで使われていることで有名な、pjaxを実装してみます。
オーバーレイを出すときにオブジェクトを上から表示させて、消すときに下にやりたかったのでそのデモ。
Ajax関連メモ。 jsonpを使った場合。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
var w_jsonfile = 'http://xxxxxx.jp/hoge.php'; <!--more--> $.ajax({ type:"POST", url:jsonfile, dataType: "jsonp", jsonpCallback: 'callback', success:function(data){ console.log(data); }, error :function(XMLHttpRequest,textStatus){ console.log(textStatus); } }); |
ポイントは、jsonpの場合は、jsonpCallbackパラメータが必要。 jQuery 1.5以降はこれで戻り値を指定する様になったようだ。 詳しくは、http://api.jquery.com/jQuery.ajax/ で、hoge.phpではxmlからjsonへ変換して、上に倣ってcallback()の形で返す。
1 2 3 4 5 |
$xml = "fuga.xml"; $result = simplexml_load_file($xml); $encode = json_encode($result); header("Content-Type: text/javascript; charset=utf-8"); echo sprintf("callback(%s)",$encode); |
これでOK。
さて、ナビが出てくる所の動きは理解出来た。 後googleナビに近づけるためには、ナビの上下の動きがどうもカクカクした感じがあるので、何とかならんかと本家を見てみた。
http://qiita.com/items/64e4589e37944bf032d9
jQuery deffered について ajaxでスクリプトを書くときに、ajaxで取った値を基に別のリクエストを送って、返り値を一回目のリクエストと合わせて表示、 なんてことをやる必要があった。 最初recursiveだけで組んでみたが、良い機会なのでdefeerdと組み合わせて使ってみる。かなり見通しが良くなった(と思う)
プラグイン作成の練習。 スクロールと同時にランダムに動くプラグインを作成しました。 基本ソースは以下。
Powertip Powertipを使って、フォームの入力補助テキストを表示する。 とても便利だったので、簡単にメモ。