タグ

JavaScriptとtabに関するr_shiのブックマーク (2)

  • JSで要素の表示の切り替えをした時にリロードしても状態を維持する - WebDelog

    下記のように、Javascriptを使って要素の表示を切り替えて、 非遷移のページを作成する場合があると思います。 Demo 2011-08-07 1st - jsdo.it - share JavaScript, HTML5 and CSS これはCSSのプロパティDiplayをリンクをクリックした際に切り替えているだけですが、 ユーザにとっては画面の遷移が無いのでとても快適ですよね。 ただ、あくまでCSSを切り替えてDivを表示させているだけなので、 うっかり更新ボタンを押してしまったりすると、 初期の画面の状態に戻ってしまいます。 (上記の場合だと最初のリンクだけが表示されている状態) これによって普段と違う動作に利用者が混乱してしまうことがあるかもしれません。 今回はこれを解決します。 解決法 クリックしたときにURLにハッシュが付加されるようにaのhrefを以下のように編集します

  • jQueryを使ったタブメニューの実装サンプルまとめ

    **追記** この記事とは直接関係ありませんが、自作のタブプラグインを貼っておきます。 rin316/jquery.tab: jQuery tab plugin. **追記終わり** 仕事でjQueryを使ったタブメニューを作ったので忘れないようにメモ。 それぞれの挙動も比較しやすいように並べてみました。 今日が勉強初投稿の日! 写真:新川通りで撮った桜。 まずはファイルの用意 下記リンクからダウンロード。 ・jQuery体…Past Releases内→最新バージョンのMinified ・Download Builder | jQuery UI (このサイトで使っているui.tabs.zip) head内にリンクを張る ダウンロードしたファイルに対して、head内にリンクを張ります。 [html] [/html] さっそく使ってみる 文にhtmlを追加。 [html] タブ1 タブ2

    jQueryを使ったタブメニューの実装サンプルまとめ
  • 1