まぁ、こんなもの…

　相変わらず具合に我ながら苦笑…。

　何日もかけて、何時間もかけて、自分一人でなんとか実現しようと結構苦労して、やっとの思いで実現にこじつけて、ちょっと冷静になって、何となく頭の片隅にモゾッと浮かんでいた「もしかしたら…」という別の方法を確認してみたら……。

　案の定、実はめっちゃ簡単にそれを実現する方法がちゃんとあって…。
　何となく自分でも「そうじゃないかな…」と思う部分もあるものの、でも、一旦漕ぎ出した船を引き返すのが面倒臭くてそのまま沖へと向って、何日もかけてぐるっと一周航海して戻ってきたら、実は目的の物はその出発した浜辺に落ちていた……みたいな。

　こういうことが過去にも何度もあって、自分の悪い習性であることも一応分かっているんだけど、もう一つの悪い習性である、一旦決めたら納得するところまで、最後までやらないと気がすまない。途中で違う方向に転換するのが酷く面倒に思えてしまうという部分の方が勝ってしまって、何度も苦い思いをしているわけで…。

　あーダメだなぁ、やっぱり。。。

　ということで、今回も見事にそのパターンだった。

　正直、一番最初にこれをやりたいと思ったのは去年の夏頃なので、苦節8ヵ月。
　で、最近、またブログを見直していて、改めてやはり実装したいと思って、調べて、調べて、英文読解して、試して、調べて、調べて、調べて、英文読解して、調べて、調べて、試して、試して、試して、jqueryをかじり勉強して、調べて、試して…。

　て、全体的にはこんな配分で4日間程費やして、さっきやっと完成したものが、大体似たような感じの機能として、元々はてなダイアリー（はてなブログ）＝はてな記法（はてなの仕様）として備わっていたという…本当に“チャンチャン♪”な世界が広がったという悲しい現実。。。

　そもそも、何がしたかったのか。

　昔にあったリンクにカーソルを合わせるとリンク先サイトのプレビューが小さな吹き出しで出現するというアレ。

　私としてはいちいちクリックして新規画面が開くのも、元画面が切り替わってしまうのも本当はあまり好きではなく（じゃ、どうやっていろんなサイトを見るのか…という話だけど…）、しかもそれが、自分の予想に反していたり、期待外れのものであれば、そのショックはそれなりに大きく、疲労感さえ感じてしまったりするような。

　ジャンプする前に大体どんな雰囲気のサイトかイメージ的にだけでも分かっていたら、大方予測はつくし、その上で飛んで、やはりハズレだとしてもそれはそれで諦めもつくというもの。尚且つ、私はカンが良い。

　まぁ、そんなこんなであのサービス（スクリプト）は私にはとても便利だったのだが、気付けば今はそのサービスはまともに機能していない様子で、去年の夏にちょっと残念な思いをしたのだった。

　で、何とか変わりのサービス、無料配布スクリプトなどがないかと探したが、なかなかいいものが見つからず、そんな中でも辛うじて使えそうなものを見つけて、その時に数回使っていたスクリプトを久々に試してみたら、またもや機能しないという。。。はぁー、もぉー、ナンデヤネン…である。

　結局そのスクリプトの配布元が閉鎖？消滅？しているみたいなことが分かった。あー、ネットの世界は栄枯盛衰サイクルがホント早過ぎる…。

　ということで、去年見つけていたけれど、結局採用しなかった（たぶん）二番目の候補に再トライすることに決めた。

　まぁ、これが大変だった。

　丁寧なのか、突き放しているのか分からないような解説（しかも英語）を頼りにプログラムなんてほとんどさっぱり分からず、いつも“マネ”や“切り貼り”することで、適当にやりたいことを実現させてきた私としては、マネしたくても、その大元の基本的なことがイマイチわからなかったり、プログラムとか触っている人には説明するのがバカらしいような基本中の基本の記法が分からなかったりして、もう本当に本当に苦労して、最終的に今日も朝6時30分頃からやり始めて何とか完成したのが14時頃。

　こんなことしている時間はないにも関わらず…。

　で、少し落ち着いて、何となく気になっていた画像のことをはてなのヘルプで見てビックリ。

　リンクに「:image」タグ？を付加すれば、勝手にリンク先をプレビュー表示してくれるって書いてあった・・・・。

　これができると分かっていれば、先日探した「無料画像素材サイト」もほぼ不要だったし（記事の見栄え的な意味合いもあった為）、今回、大事な仕事の勉強そっちのけで没頭していたポップアッププレビュースクリプトの実装もほとんど不要だったのだヨ…。ナンテコッタ…。

　というわけで、

　↑こちらに便利な独自機能が色々紹介されている。。。

　腹立ち紛れってことでは全然無いが、ちょっと悔しいし、万が一どなたかの役に立つかも知れないかも知れないということも考えて、事の顛末を記録しておくことにしよう。

「snap shots」
昔、よく見かけていた頃に私も使っていたサービス。サイトは生きているみたいだけど、なんだかサイトの証明がどうとかOperaが言ってくれるし、結局私はこれを使えるところまでは到達できず、やはり今回も諦めた。
「websnapr」
前回断念したサービス。今回もやはりこれ単独での利用はあまり上手く行かず諦めた。がしかし、結局、他スクリプトを介して利用することになった。無料だけれど、スナップ数の制限が10万ショット/月とのこと。ま、普通は？というか、私の場合はそんなに絶対行かないと思っていたが…。これが甘くて、後でまた一苦労する羽目に…。
「HeartRails Glance」
前回も利用しなかったが、今回もイマイチスムーズに使えず、断念。
「jLinkPreview」
使っていたはずだが、今はもう無かった。。。
「qtip」
前回は面倒臭そうだったので止めたが、今回はめっちゃ働いてくれている。手こずらされたけれど…。新バージョンは（も？）jqueryのプラグイン（この表現でいいのかな…）。この「qtip２系」と「websnap2.0」を使ってリンク先プレビューを実現させた。

◆◆　実装時に困ったこと

qtip２のDLページで自分の利用したい機能を選択してファイルをDLするのだが、選んでDLしたはずなのに、cssが2回やっても基本設定のファイルしかDLできず、結果的にweb上でソースを見て、自分で付け足した。
cssは<head>内、jsと他のファイルは</body>直前に置くのは解説で分かった。しかし、肝心の私が望んでいるwebsnaprを利用してプレビューさせる部分のスクリプトはどこに、どんな風に置くのかが分からず、そもそも、jsファイル内に書かれていると思って、それを抜粋して例示しているのではないかと思ったりして、結構な時間その部分でずっと悩んでいた。jsファイルに書かれてそうな気もするけれど、書かれていなさそうな気もとってもする。カンのいい私としては、後者の可能性を強く感じたりして…。

demoにあったソースを見ながら、まさにこれなんだけど、これをどうすればいいのだろうと、qtip２のサイトをデモ、ダウンロード、ガイド、オプション、プラグイン、APIと何回も何回もくるくる、くるくる順番に、上から下まで一生懸命読んだ。でも、どこにもそんな“初歩的”な事は書いてなかった…。フォーラムを見て、別の目的に関する質問だけれど、そこに例示されていたソースを見て漸くwebsnapr用のスクリプトも<script>で括って</body>直前に置けばいいことが想像できた。ここにたどり着くまでがとっても長かった。。。
プレビューが現れたものの、css（デザイン）が気に入らない。何種類か選べるようになっているようなのでそれを使おうとするも、そのクラスの中味となる設定部分がcssファイル内に見当たらない。。。まさか、その“クラス名”を指定するだけで、jsファイル内のスクリプトで切り替えてくれるようになっているのだろうか…とか考えたりして…。「でも、普通はcssファイル内に書いておくよね…」とかも思ったりして…。でも、変更できるはずのlight設定は私がDLしたcssファイル内には登場しない…。

しばらく悩んで考えて、またフォーラムを見た。何となく似たような質問があって、まずデフォルトをFALSEにしないといけないと分かり、jsの中でFALSEに変えて、スタイルに関するらしき部分で自分の希望する設定のクラスを指定してみた。

そしたら、css設定がまるごと無くなって、枠も影も何にも表示されず、中味（プレビュー部分）だけになってしまった。
また暫く悩んで、色々と指定の書き方を変えたり、別のクラスにして試したりしたけれど、ウンともスンとも言わず、相変わらず中味だけ…。

また暫く悩んで、今まで全く関与していなかったと思われる部分（そこで指定されているクラスの色指定でも一度も表示されなかったので）を、ダメ元で変えてみた。　　　　　　そしたら、変わった。
これでほぼ自分の望み通りの状態になった！と思ったのも束の間、何度か試している内にプレビューされなくなった。「limit exceeded」だって。。。。。
で、言われるがままにwebsnapのサポートページを見たら、未登録じゃないか（登録済みですが…）、30日間で10万ショットを超えたんじゃないか（超えるわけないだろ、さっき使い始めたんだから…）とか書いてあって、リミットが嫌なら有料メンバーになりなさいと提案された。

有料メンバーになるくらいなら使うのを止めるけれど、それにしてもリミットかけられたのが全く納得いかないので、そのまま読み進めると、“未登録”の場合は1時間に80ショットまでということも書いてあった。私はとっくに登録しているし、スクリプトにもちゃんと自分のkeyを指定している。でも、今のwebsnap用のスクリプトはこのブログの<a>タグ“全て”をスナップしてしまうようになっているので、それを考えれば、1時間に80ショットなんて軽く越してしまうだろうな、ということが分かった。登録済みだけどね。
jqeryを書き直さなければならなくなった。。。。最初はjavascriptで調べたのだけれど、なんだか近いだけでドンピシャな回答が見当たらなかった。今でも分かっていないけれど、何となくjqueryで調べたほうがいいような気がして、そっちで調べていった。すると、ラッキーなことにこちらのページhttp://stackoverflow.com/questions/9237538/jquery-select-all-elements-with-a-common-classがヒットしてくれて、やっと特定のクラス属性を持つ<a>タグだけにスクリプトを実行させるように出来た。あーーー長い道のりだった。