yuheijotaki.com

pjax その2

pjaxだいぶ分かってきたような

テンプレはこんなん
デモ

引っかかったのが何個か

◯ブラウザでの進む/戻るでの読み込みコンテンツ
再現パターンあまりつかめなかったけど、ブラウザで戻るしてもたまにURLだけ変わってpjaxの読み込みコンテンツは変わんないことが(リロードすれば直る)
こことかも詳細ページ→トップを繰り返しているとなるので仕様かなーと思ったけど
絶対パスで書いたらいける感じ

◯ブラウザでの進む/戻るでの固定要素の扱い
例えば、ページ読み込みで alert(); を突っ込んでおいてpjaxでページ遷移して、ブラウザの戻るボタンをしてもアラートがならない
それできないことにはこういう固定要素のナビ上でアニメーションで現在地を示すのは難しいなーと思ってたら、popstateっていうイベントがあったのでそれで回避

$(window).on('popstate', function(e) {
	alert('browser go back');
});

◯遷移時初回ロードのエフェクト
サイト内で遷移する際はpjaxなのでエフェクト書いてるのだけれど、意外と忘れがちで面倒なのがサイトへの初回遷移時
これは

$(document).on('pjax:complete', function() {... と同じ内容を $(window).on('load', function(){...

に書くだけ

◎参考