Ajaxとブラウザの戻るボタン
Ajaxでページ遷移なく見せる、のはいいんだけど、ブラウザの戻るが効かないので、ちょっと弱った。
さっそく検索してあれこれ。
page0の中のリンクをクリックしてpage1に移動。
page1の中のAjax部分をクリックしてpage1の中の一部を書き換える。
と、ここまでは期待どおり。
で、そのpage1を見ていて、ブラウザの戻るボタンを押すと、page0に(当然)戻ってしまう。
page1の中が書き換わっているんで、「戻る」に期待するのは書き換わる前のpage1
ajaxでページが書き換わっていますよ、というフラグを立てておいて、
window.onunload=function(){
if( ajax_page ){
location.replace(document.location);
}
ajax_page = '';
}
とやれば、ブラウザの「戻る」が期待どおりとなった。ただ、これは、単純に戻るだけ。フォームなんかがある場合、きちんと入力されたものの面倒を見てあげる必要がありそう。そうなるとまた面倒かな。
参考にさせてもらったURL
https://japan.internet.com/developer/20080215/26.html
https://fnya.cocolog-nifty.com/blog/2006/12/post_8be2.html
金曜土曜と飲みすぎて、今日はへろへろとウチでごろごろ。そういや、ヨメにつきあっていった表参道のかんざし屋さんは、わたしのようなおっさんが見てもいい感じのカワイイモノだった。
https://www.wargo.jp/
[02/17 23:11:44]
とか思ったら、やっぱり「戻る」がうまくいかんなぁ。何度か「戻る」で、「戻る」のhistoryが尽きてしまって、戻れなくなってしまう。ダミーでもhistoryに突っ込めれば、と思って検索してみるけどヒットせず。
書き換わるコンテナ部分に「戻る」をつけて代用して…もらえるかねぇ。。。
[02/17 23:26:30]
あ。そういや。
ふたたびみたび、東京歯科大学水道橋病院。取れたブリッジをもって久しぶりの水道橋。とりあえずそのまま入れてもらって、歯周病のための、歯石取りなどなど、でしばらく通うことになった。担当の先生は約2年前と同じ、歯ヲタクっぽいねいちゃん先生だ。
地元のヤブくさい歯医者に比べると、やっぱりこっちは数段安心感がある、かな。
予約の時間までちょっとあったんで、時間つぶしにはいった旭屋にびっくり。入り口すぐ、レジ前の面陳スペース(特等席)がコミックコーナーになってた。客もまばらで、儲かってません感、がヒシヒシと。書店としての矜持、みたいなものはないんかい。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
めも
メモ。
あやしいところは。
clear:bothしてみる。親もfloatしてみる。float:noneしてみる。
IE6用には _width _marginなどアンダースコアプロパティ
FireFoxなどには :root疑似クラス(?)
を使って後で指定。(ネットショップで一日120万PVのアクセスログを見る限り、IEの圧勝)
inline-blockは確かに便利だけどfirefoxは対応していないので使わないでくれ。ブロック要素をいじるんでhtmlの方を書き換えることになっておおごと。
input passwordフォームの黒丸。IEだとMSゴシックなど日本語フォントの指定が原因で「黒丸」が大きい。半角に合わせるにはそこだけfont-familyをarialなど欧文フォントだけ指定。でもってそこにpadding:0なんてのを指定するとIE6だと黒丸が欠けてパックマンになるんで、_paddingを少しだけ。なんだかなあ。
同じく input textエリア。カーソルの高さとフォームの高さが合ってなかったり、カーソル点滅後微妙に上とか下にずれる時。フォントと行間などがうまく合ってない。とりあえずline-heightの指定を1emにすれば妙な挙動はなくなる。(100%とかpx指定だとカーソルが動く)
IE6は、センタリングのためのmargin autoをうまく解釈してくれないことが。親にtext-align:centerを。
IE6でdiv要素の最後の文字などがヨコチン状態になることがある。paddingを0pxに指定してると起こりやすいので_paddingで適当に(検索すると3pxという事だけど、1pxでもハミチンの収まったところもあった、かな)ていうかIE6でpadding:0は危険。
negative marginがごちゃっとあると、FireFoxでは、下のレイヤーの見えているリンクがクリックできなくなったりする。用もないのにネガティブマージンは使わない。
border:1px red solid をエディタに登録しておいてワンキーで埋め込めるようにしておくと便利。
てのが仕事絡みのリニューアルメモ。
「ブラウザ」の「戻る」挙動にハマった。
IE7。
ログインページでID、パスワードを入れてエンター。LocationでHOMEに飛ぶ。工事中のHOMEにはリンク先のない空リンクがたくさん。ある。それを適当にたたくとページが遷移してHOMEが再び。そこで「戻る」と、なんとログインページで入力した内容がHOMEのinput textに出るじゃありませんか。よりによってログインIDだ。こんなものが現れたら腰がぬける。キャッシュがいけないのか、Locationで飛ばすのがいけないのか、それともJavaScriptがなにかやってるのか、で悶絶。
ところがFireFoxだとこんなことは起きない。「戻る」とログインページに、意図したとおり戻ってくれる。
ぐぐるための単語すら思いつかず…。あれこれ試してみたところ、a hrefが空のリンクの時にだけ起こることが判明。ページが完成したら、リンクが空、なんてことはありえないのでほっと一息。
しかし、IEはなんでまた違うページのフォームのデータを余計なところに出すんだろう。空のリンクを踏んだ時の挙動が変なのかな。
てのが読書SNSリニューアルのネタ。
今回は表示回りの部品を先に作ったので、スクリプトを書きながらスタイルシートも一緒に考える必要がないのでそっちはラク、かも。
うちの王様は点滴から投薬に切り替え、自宅療養。
そういや、古処誠二「敵影」が直木賞候補になってたのか。うーん、残念。
都心は底冷え…
[15:01:48]
ありゃ。rssが変だった。
- 『おかえりください』サウンドノベルWINDOWS版
- 『おかえりください』本編を加筆修正、6つのバッドエンド分岐シナリオを追加してサウンドノベル化!
音と映像が、血まみれのこっくりさんの惨劇を蘇らせる。 - 【無料体験版】はこちら
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
今年は激動なのか。。。
へろへろのよれよれ。
同じHTML、CSSを食わしてるになんで見え方が違うんだクソ野郎、と。そのためだけにしなきゃいけない地引網作業は精神的肉体的に、ひたすら疲弊するだけだ。CSS系の本やブログを見ると、ハック使いまくりで1pxピタリあわせて得意満面ぽいんだけど、んなものは本末転倒。こんな無意味な作業に喜びを見出すヒマがあったら、そのエネルギーをもっと違う、生産性の高いところに使え、馬鹿かお前は、と。そっちにまで八つ当たり気味。
そもそも、
印刷の解像度とパソコンの解像度はケタがいくつも違うことぐらい知ってんだろうな、とか、全部混ぜたら黒になるのと全部混ぜたら白になる(反射と透過)ので色は真逆だというぐらい知ってるよな、とか。なのに「なんちゃらのポスターのような仕上がり」てなネームがうれしそうに踊るのを見るのは、わたしにはとても恥ずかしくて耐えられない。
で、もっとしょぼんなのが、うちの23年の長老…突然の腎不全悪化で、連日の獣医通い。正直、あぶない。点滴でどうにか体力をもたせている、というのが現状、らしい。とほほほほほほ。生き物とつきあう、というのはやっぱりハードなことなんだ、とつくづく重い。うちの中でも当然の天然おれさま系。当人がしんどい思いをしないように、とだけ。
ついでにまいるのが、止まらない咳。年明けに出された抗生物質を飲んだわりには治った感じがない。相変わらず喉がかさついて何かがはりつく。レントゲンまで撮ってこの有様か、と毎月行ってる医者のヤブ疑惑がむくむくと。
ネガティブ三連発(うちひとつは、我が家のクリティカルなんだけど)しててもしょうがない。
読書SNSのリニューアル。時間がとれずに遅々として進まないんだけど、こいつは面白い。Ajax使ってあれこれ。
書店の書棚の前をうろついて、手軽気楽に本を引っ張り出してぱらぱらっとめくる感じ、というのを考えたときに、Ajaxはちょうどいい。思いつきをいくつかスクリプトに起こしてみたら自画自賛レベルだけど、けっこうイケるな、と。
初老を目前にあれこれ、
おれさまOKの製作物で売り上げもそれなりに回ってきた頃(エロ本編集時代)がおそらく一番おいしい頃だったなぁ、と。そこでの居場所がなくなって、職安だの派遣だので、仕事を探して今にいたるわけだけど、どこもおれさまOKではない。
わたしの判断基準は「面白い・つまらない」「好き・嫌い」がすべて。金儲けが面白いのではなくて、おれが面白いと思うことをやって副次的に金が入ってくればすごくうれしい、のだ。てなことをいうとガキか、と言われそうだけどもうすぐ50だ、おれは。ガキと呼ぶなら呼んでくれ、ぐらいのあつかましさは身につけた。
つまらないことを嫌々やって大金持ちっ〜!よりも、面白いと思うことをやってんだけどド貧乏!、の方がよっぽどマシ。
てことで、今年は、自分OKで動くウチの読書SNSの方にウエイトを傾けていこう。自分のアウトプットとして、こんなこともやってます、というものをきちんとひとつ確保・担保しておこうか。
[01/15 08:33:22]
おまけになんか風邪が悪化してるじゃん。よわりめにたたりめだぜ、ちくそお。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
咳がひどいゼ
体力の限界を痛感しつつ朦朧としながらもまだまだ続くサイトリニューアルは、あれこれ検索しながら模索しながら右往左往、だ。で、重くなるので、レスポンス速度優先の仕事絡みのサイトでは見送ることにするけど、lightbox.jsとかyahooのライブラリとか面白い。ページ遷移を少なくするには、フローティングウインドウは必須なんで、あれこれ探してたところだ。今、ウチの本棚画面で使ってる自作のフローティングウインドウは残念ながら、なんか、もさいださいねむい。その点YUIのコンテナ系はおしゃれでしっかり安定感がある。ただ、この手のライブラリはいろいろてんこ盛りで必要のないものもはいってるし、そもそも、わたしのスキル・知識ではなにか不具合を出した時に原因特定・
修正ができんだろ。prototypeだけでもわけわかめだってのに、運用していて無理が出そうなものはあまり入れたくないし…けど、面白いし、ううむ、うだうだ悩みどころ。
喉鼻がやられて咳がひどい。熱が出ないことを祈る。困ったもんだ。ぎょぎょぎょぎょ(死語)
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
やっとOKかも。
犯人を追いこみ中だ。
だいたいリニューアルするってのに、リニューアル前よりレスポンスが悪くなる、なんてのは「ありえない」。
レイアウトデザインは今度のほうがかなりいい。テーブルレイアウトを使ったのはごくわずかで、ページの変更・更新もラクにできる、はず。
ところが、レスポンスがどうにもダメ。
Extended Statusbar
Load Time Analyzer
ここんとこずっと、FireFoxに入れた上記ふたつのアドオンを睨みっぱなし。同じデータを扱ったページで比較すると、旧サイトが1秒ほどなのに今度のサイトは2秒が切れない。ぶっちゃけ、旧サイトはテーブルで囲って、ピクセル単位でそろえるためだろう、なんのこっちゃな意味なしテーブルだらけ。そんな旧態依然のサイトの方が早いのだ。もう愕然というか茫然自失。
cssを疑いJavaScriptを疑い、ひとつ削ってはアドオンの数字をチェック、という地引網ちからワザ作業を延々と続ける。で、今日ようやくどうにか2秒を切った。これで旧サイト同様「早いサイト」だ。ほかのパソコンで検証しないといけないけど、ほぼOK、かな。最大の原因と思われるのはJavaScript。たぶんdocument.writeのコストが高い。htmlを書き換えるんだから、細かくdocument.writeの数が多いとそれだけで表示が重たくなる…のかなぁ。
少しほっとしたぜ、ちくそお。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」
悩みはつきない
悶絶。レスポンスが悪いのだ。
ネガティブマージン使って左右を入れかえたり、画面のリサイズをJavaScriptで監視してdiv要素の幅をいじってたり、さらにおまけに1ページ270枚ものサムネイル画像。
画像は、急遽でっちあげた、8枚を一枚に合成して返すスクリプトで様子見(本番では当然全部作成して静的にする)とりあえずこの時点でほんの少し早くなったけど。
ネガティブマージンを使うと、ブラウザは全部読み込んでからレイアウトを決めるっぽい。googleのLoadTimeAnalyzer(?)で見てると、同じようなデータ量の別サイト別ページで、読み込み自体はこちらのほうがむしろ早いのに、表示開始で負けてる。最後まで読み込むのに、こちらは3秒弱、対象にした別サイトでは倍近い6秒弱。ソースを見るとテーブルの入れ子使いまくりなのに、こちらより早いんで愕然。
しょうがないんでネガティブマージンを使わずfooterの位置はなかったものとしてpositionのabsoluteで配置してみる。するとブラウザはある程度読み込むと表示を開始する、っぽい。確かに体感できるぐらいは早くなった。…けど、まだ表示開始が遅い。ちょっとふんづまりを起こしてる。
JavaScriptが、リサイズのために計算してるからちょっと待ってくれと。テーブルタグで作るとたぶんこのリサイズ処理が不要になる。
どうせリスト画面だし、このページだけでもテーブルタグで全面的に書き直すことも考えなきゃいかん。ショップサイトはスピードが最優先。コンマ数秒の違いが売上に直結する、と。じっくり選ぶような商品なら話は別なんだろうけど、ほんとにレスポンスで売上は違ってきそうだし。うううむ…シビア。へろへろ。
webは、間違いなく、文書の論理構造とデザインレイアウトを分ける流れだ。
ブラウザのレンダリングも、検索エンジンも、その方向に沿って表現力をあげるし効率よくクロールするはず。
なもんで、なにかとcssとhtmlの方が都合がよろしい。
テーブルタグを使ってレイアウトすると、今後ちょっとしたレイアウトやデザイン変更に、時間労力など「無駄な」コストが発生して、硬直化したサイトになってしまう。phpやjavascriptを、一度テーブルタグページに埋め込むと、縦のものを横にするだけで、いちから書き直しだ。
…とはいえ、使う側はタグなんて関係ないしねえ。
» ローカル環境で電子書籍を作る、Macアプリ・Windows版ツール 「かんたんEPUB3作成easy_epub」