JQueryアンカーナビゲーション(グレースフルデグラデーション)

私は最近、興味深いjQueryプラグイン、 BBQ-Back Button&Query Libraryに出会いました。



そして、その基礎に基づいて、アンカーに基づいてナビゲーション用の独自のプラグインを作成することにしました。 自分で設定したタスク:

  1. JavaScriptがオフの状態でのリンクの通常の操作(読み取り-検索エンジンによるページの通常のインデックス作成)
  2. 追加のリクエストなしで通常のアンカーリンクをサポート
  3. ロードされたコンテンツをページのさまざまな領域に表示するためのサポート


結果はここで見ることができます 。 そして、もう少し読むことができます。



UPD:ご列席の皆様 、ページにアクセスできないことに不満をお持ちの方もいます(403 Forbidden)が、このようなものは見当たりません。 コメントは作業バージョンへのリンクを提供しました。私のリンクが機能しなかった場合は試してみてください: http : //vbolshov.org.ru.nyud.net/anchornav/







これは、セレクターで選択されたリンクを「アンカー」リンクに変えるプラグインを作成し、オプションでコンテンツを表示するターゲット要素を指定できるようにするというアイデアでした。



その結果、次のように使用できるプラグインが表示されました。

$( 'a.anchornav' ).anchornav({

// -

target: '#content' ,



// CSS-class, ,

loading_class: 'loading' ,



// , ,

loading_text: 'loading...' ,



// CSS-class, ,

active_class: 'anchornav-active' ,



// . -, #<namespace>:<URL>

namespace : 'a' ,



// ( - ).

// ,

// back forward, ( ) -

// .

// , , .

handle_empty_anchor: true

});




* This source code was highlighted with Source Code Highlighter .








結果:すべてのリンクには通常のURLがあり、検索エンジンによってインデックスが付けられますが、コンテンツをページの適切な場所にロードします。 同時に、コンテンツには、たとえばページのタイトルを変更するスクリプトが含まれている場合があります。



このようなことをサポートするには、サーバー上でいくつかの操作が必要になります。 リクエストがAJAXリクエストであるかどうかを確認し、それに応じて、完全なHTMLページまたはその一部のみを生成する必要があります。 したがって、javascriptを無効にしたユーザーも問題なくサイトを閲覧できます。



PHPでは、このようなチェックは次のように実行できます。

$ xmlHttpRequest = filter_input(INPUT_SERVER、 'HTTP_X_REQUESTED_WITH'、FILTER_SANITIZE_STRING);




まあ、それがあったように、すべてがそうです。 コメントや提案を歓迎します。



All Articles