Created
November 25, 2014 08:21
-
-
Save RYO-mini/b551a8907bd245df1df3 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * バージョン0.1 | |
| * 試用版 | |
| * パンくずリストを自動生成する | |
| */ | |
| /* | |
| * 使い方 | |
| * 1. このファイルを読み込む前に、jQueryを読んでください。 | |
| * <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> | |
| * <script type='text/javascript' src="../common/js/breadcrumb.js"></script> | |
| * | |
| * 2. パンくずリストを表示したい箇所に以下を記載してください(ulの子要素にli及びaタグが挿入される)。 | |
| * <!-- パンくずリスト --> | |
| * <div id="breadcrumb_area"> | |
| * <ul id="breadcrumb_list"></ul> | |
| * </div> | |
| * | |
| * 3. 挿入後のイメージは以下のようになるので、CSSで装飾してください。 | |
| * <!-- パンくずリスト --> | |
| * <div id="breadcrumb_area"> | |
| * <ul id="breadcrumb_list"> | |
| * <li><a class="bread" href="pages_url">ページ名</a></li> | |
| * <li><a class="bread" href="pages_url">ページ名2</a></li> | |
| * <li><a class="bread" href="pages_url">ページ名3</a></li> | |
| * </ul> | |
| * </div> | |
| */ | |
| /* | |
| * 環境に応じて書き換えてください ここから ---------- | |
| */ | |
| //トップページがあるディレクトリ名 | |
| var dir_root = "20130211"; | |
| //パンくずリストにindex.htmlを表示するかどうか | |
| //表示する -> 1 表示しない -> 0 | |
| var flg_disp_index = 0; | |
| //置換するファイル名、ディレクトリ名 | |
| // | |
| //※先にファイル名を書いて、ディレクトリ名は後ろに書いてください。 | |
| //※最後の要素を書いた行にカンマは付けないでください。 | |
| var name_list = [ | |
| ["gaiyo", "会社概要"], | |
| ["jigyo", "事業内容"], | |
| ["20130211", "トップページ"], | |
| ["jisseki", "制作実績"], | |
| ["staff", "スタッフ紹介"], | |
| ["price", "料金表"], | |
| ["sitemap", "サイトマップ"] | |
| ]; | |
| /* | |
| * 環境に応じて書き換えてください ここまで ---------- | |
| */ | |
| //表示しているページのパスを取得し、dir_rootの前後でカットする | |
| var href = location.href; | |
| split_arr = href.split("#"); // ページ内リンクを削除する | |
| href = split_arr[0]; | |
| if( flg_disp_index == 0 ) { | |
| href = href.substring( href.indexOf( dir_root ) ); | |
| } else { | |
| href = href.substring( href.indexOf( dir_root ) + dir_root.length ); | |
| } | |
| //パスを/単位で区切り、url_listに保存する | |
| var url_list = href.split("/"); | |
| //index.htmlを表示しない場合、配列から削除する | |
| var index_no = url_list.indexOf( "index.html" ); | |
| if( flg_disp_index == 0 && index_no != -1 ) { | |
| url_list.splice( index_no, 1 ); | |
| } | |
| var href = ""; | |
| for( var i = 0; i < url_list.length - 1; i++ ) { | |
| href += "../"; | |
| } | |
| //url_listの各要素を、name_list配列の値に応じて入れ替える | |
| for( var i = 0; typeof( name_list[i] ) != "undefined"; i++ ) { | |
| var index_no = url_list.indexOf( name_list[i][0] ); | |
| if( index_no != -1 ) { | |
| url_list[index_no] = name_list[i][1]; | |
| } | |
| } | |
| jQuery(function(){ | |
| for( var i = 0; typeof( url_list[i] ) != "undefined"; i++ ) { | |
| jQuery('#breadcrumb_list').append('<li><a class="bread" href="' + href.substring( i * 3 ) + 'index.html">' + url_list[i] + '</a></li>'); | |
| } | |
| // liの最後の要素の<a>タグを外す | |
| var a_text = $("#breadcrumb_list li:last-child").text(); | |
| $("#breadcrumb_list li:last-child").empty(); | |
| $("#breadcrumb_list li:last-child").text( a_text ); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment