十和田湖から小坂まで戻り高速で弘前へ。
弘前IC出口が1kmの渋滞。街中も渋滞してましたが、裏通りに入ると車も少なく、すんなり駐車場に入ることができました(^_^)
角館に続き、徒歩で弘前を散策。前日よりもさらに良い天気で汗ばむほど。
まずは御朱印目的で最勝院へ。
最勝院
田沢湖
角館の後、田沢湖へ。
田沢湖は「日本一深い湖」と言うことで一度は訪れておきたかった所。
辰子伝説と言うのがあって、辰子像がいくつか点在しています。角館から来ると金色の辰子像前に出るのですが、それはパスして、御朱印目的で御座石神社の方へ。残念ながら手持ちの朱印帳には書いていただけないとのことでご遠慮しました…
すでに夕方で日も傾いていたこともあって、とっても寒かった。
お土産屋さんでGETした「きりたんぽ」があったかくて美味しかった♪
追伸：
以前、mixiで写真を拝見して感動したんですが「RIDER'S LEFT EYE」さんのところのこちらの記事にとっても綺麗な田沢湖の写真があります。
こんな景色を見たかった…。いずれもう1度行かないといけないですね(^_^;
タグ：湖
Highslideの属性を自動設定する
Highslideの機能を有効にするためにはアンカー<a>にclass属性とonclick属性を付加する必要がありますが、JavaScriptを使ってonclick属性を自動的に追加することができました。
前回と同じく「小粋空間」さんのところのこちらの記事「HighSlide JS の onclick 属性を JavaScript で登録する」に詳しく書かれています。
紹介されているスクリプトを利用するとclass="highslide"が指定されているアンカーについてonclick属性とonkeypress属性が追加されます。
当ブログではExif情報の一部をキャプションとして掲載したいので、少し修正してみました。
function addHighSlideAttribute() {
var isIE = (document.documentElement.getAttribute('style') ==
document.documentElement.style);
var anchors = document.getElementById('content').getElementsByTagName('a');
for (var i = 0, len = anchors.length; i < len; i++) {
if (anchors[i].className == 'highslide') {
if (!anchors[i].getAttribute('onclick')) {
var img_name = getFileName(anchors[i].href);
var ev = "return hs.expand(this,{captionId:'caption-" + img_name + "'})";
isIE ? anchors[i].setAttribute('onclick', new Function(ev)) :
anchors[i].setAttribute('onclick',ev);
isIE ? anchors[i].setAttribute('onkeypress', new Function(ev)) :
anchors[i].setAttribute('onkeypress',ev);
}
}
}
}
function getFileName(href) {
var fe = href.substring(href.lastIndexOf('/',href.length)+1,href.length);
var f = fe.substring(0,fe.lastIndexOf('.'));
return f;
}例えば、画像ファイルのアンカーが href="http://〜/image001.jpg" だった場合、"caption-image001" がキャプションのIDとして指定されます。
これで随分作業が軽減されました。
驚き(^_^;
ちなみに画像を左寄せなどにするために、
margin: 0px 5px 5px 0px;を外部ファイルのCSSに記述してclass="〜"で指定しようとしたんですが、Highslideの動きがおかしくなりました。インラインで指定した場合は問題なし。
float: left;
残念…。
Highslideで画像表示
"おさるの旅ログ1"（ココログ）で導入した Highslide をSeesaaにも設置しました。
「小粋空間」さんのところのこちらの記事「Highslide JS でサムネイル画像を拡大表示する」を参考にして導入。
ココログと違ってSeesaaではHTMLを直接修正できるので記事の通りに設置可能です。</head>の前に以下を挿入。
<script type="text/javascript" src="http://転送したパス/highslide/highslide.js"></script>
<script type="text/javascript">
hs.graphicsDir = 'http://転送したパス/highslide/graphics/';
</script>
hs.graphicsDirを上書きしないと動きません。その他の変数も上書きすることが可能で、highslide.jsの上の方を参照するとなんとなく分かります(^_^;
例えば、credits〜を上書きすれば自分のサイト名を表示することもできます。
<div id="highslide-container"></div>
は、書かなくても問題ないようです。あとはサンプルを参考にしてCSSをカスタマイズすればOKです。
RDF Site Summary
