Jqueryについて質問させていただきます。


現在↓のような構成でページを開発しております。

▼index.php
<header.php テンプレート読み込み>
<body>
<footer.php テンプレート読み込み>

bodyの内部には、例えば
トップニュース
日記
メッセージ
検索
設定画面
といった内容のコンテンツが全て含まれているのですが、
トップニュースがデフォルトの画面になっていてそれ以外はJqueryで非表示にするよう組んであります。

例えば、この中で日記を書いた際

トップニュースで日記のボタンを押す→日記の画面だけが表示される→入力を行い確認画面へ(普通にリンクさせてindex.php以外の別ページに飛ばします)→日記の内容を修正したいので、別ページからindex.phpに戻ってくる

といった動作をユーザーがとった場合、日記のコンテンツを最初に表示させておくような仕組みを作ることは可能でしょうか?

ツイッターのスマートフォン版のようなUIが作りたいのですが、別ページから戻ってこようとするとトップニュースの画面になってしまい、操作性が悪く悩んでおります。

jqueryでご知見のある方、どうかよろしくお願いします。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2011/12/12 23:36:40
  • 終了:2011/12/19 23:40:02

回答(2件)

id:Cherenkov No.1

Cherenkov回答回数1502ベストアンサー獲得回数4922011/12/13 00:22:05

ポイント50pt

ツイッターのスマートフォン版のようなUIは知りませんが思いついたものを。

日記の確認画面から index.php に戻るリンクは index.php#diary のようにキーワードを付ける。
index.php#diaryのようなリクエストがあった場合は、非表示にするCSSなりJSを埋め込むようにする。



タブなら、同じようにキーワードを渡して
jQuery UI tabsのselectedプロパティで任意のタブを開く。
http://jqueryui.com/demos/tabs/



アコーディオンならこっち。
http://jqueryui.com/demos/accordion/

id:kuso47

ありがとうございます。phpをコンテンツ毎で分けることにしましたので、クッキーを利用して実装したいと思います。

2011/12/13 16:57:49
id:kodairabase No.2

kodairabase回答回数661ベストアンサー獲得回数802011/12/19 18:17:41

ポイント50pt

jQuery UI Tabsを使ってらどうでしょう。

長~いページもスッキリ!jQueryでタブ表示
http://ascii.jp/elem/000/000/210/210954/

  • id:kuso47

    ※日記、メッセージなどのコンテンツをそれぞれ1つのphpにして、loadさせるという手でもできるようでしたら教えて頂けると助かります。
  • id:windofjuly
    うぃんど 2011/12/13 00:35:36
    眠いのでヒントだけ・・・(ぉぃぉぃ)

    状態保持にはクッキーを使うのがお手軽です
    日記やニュースに切り替えるときに、
    JQueryからクッキーに最新の状態を記憶させるだけです

    で、、、
    ページのほうは「何も表示しない」ようにしておいて、
    JQueryがクッキーを読み取って、
    ニュースなり日記なりを表示するようにしておけば完了

    以下、余談

    ニュースを見るだけなのに、
    日記まで一緒に送られてくるのは転送時間や、
    レンダリング時間の無駄かもしれない
    それらを節約するためには、表示切替ではなく、
    必要なbodyをloadするほうがいいかも・・・

    そうなると、クッキーへの書き込みはJQueryで行い、
    phpがクッキーを読み取って必要なbodyを送る仕組みとなります

    コード書いたほうが早かったかと自分でも思うけど・・・こんな感じです
  • id:kuso47
    コメントありがとうございます。
    jquerycokkieを利用したサンプルがいくつかでてきました。
    クッキーを使ったことがないため、調べながらやってみます。。

    おっしゃられるように転送時間やレンダリングの無駄があるかなと思っていまして、phpをコンテンツで分けるようにしました。
    クッキーの書き込みをjqueryで行い、phpでクッキーを読み取るような処理を実装してみたいと思います。。。

    もしお時間があればサンプルコードをいただけると大変助かります。

    どうぞよろしくお願いいたします。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません