2007年4月30日(月)
ブログページ上にサムネイルはあるけれど、拡大画像はクリックしないと見られない……数が多いと面倒だなぁ……と感じたこと、ありません?
実際そう感じた人がここに約一名(苦笑)。
休み中にどっかへおいしいものでも食べに行きたいなぁ……と思ってネット上をあちこち散策していたとき、『
関谷江里の京都暮らし』というページを見つけ……食欲をそそられる、おいしそうな料理の画像が並んでるんですけれど、いちいちサムネイルを選択してクリックするのがなんとも面倒で。
なので、こんなブックマークレットを作成してみました。
ぴくとぽっぷ:ページ上から直リンクしている画像を順次表示するブックマークレット
ページ上に画像への直リンク(<a href="(画像ファイル)">サムネイル or テキスト</a>)があるページでこのブックマークレットを実行すると、先頭の画像をページ左上に作ったウィンドウ(div要素)内で表示します。
ウィンドウが表示されている状態で、マウスのホイールを前後に動かすと、画像が切り替わります。
画像へのリンクかどうかは拡張子で判断しており、*.jpg、*.jpeg、*.pngに制限しています。また、ココログの場合は/images/又は/photos/下の画像であることもチェックします。
【2007/05/01追記】
*.gifも対象に含めたい場合は、こちら↓をお使いください。
また、リンク先が*.htmlのものも含めたい場合は、
をお試しください。
対象となるHTMLファイル(*.html、*.htm)は同一ドメインのものに限ります。
ブックマークレット起動時にリンク先HTMLを全て読み込むため、準備完了までに時間がかかります。
また、表示される画像は1つのみ(HTML内の最初のimg要素)となります。
→【2007/06/23追記】オプション操作(下記参照)によって最初のimg要素以外も表示できるようになりました。
■操作について
ウィンドウが出ているときには、以下の操作が有効です。
なお、ウィンドウが隠れた状態で、対象となる画像へのリンクをクリックすればウィンドウが再表示されます。
リンクを[Shift]キーを押しながらクリックすると、本来のリンク先が別窓で表示されます。
- マウスホイールを前後に動かすことで画像が切り替わります。
- ウィンドウを普通にクリックすると、ウィンドウは隠れて、表示されていた画像の元リンク付近へ移動します。
- ウィンドウを[Ctrl]キーを押しながらクリックすると、ウィンドウは隠れて、ページ先頭へ移動します。
- ウィンドウを[Alt]キーを押しながらクリックすると、ウィンドウが隠れるだけで移動(スクロール)はしません。
- ウィンドウを[Shift]キーを押しながらクリックすると、その画像が別窓で表示されます。
このとき、ウィンドウは隠れません。
-
【2007/05/01追記】
マウスカーソルを一度ウィンドウの外に出した後、[Ctrl]キーを押しながら再度ウィンドウ内に入れると、画像がオリジナルサイズで表示されるようになります。
もう一度同じ操作を行うことで、縮小サイズに戻ります。
-
【2007/06/23追記】
[+GIF+HTML]のついたブックマークレットを使った場合、マウスカーソルを一度ウィンドウの外に出した後、[Shift]キーを押しながら再度ウィンドウ内に入れると、リンク先HTML内の最初の一画像以外も続けて表示できるようになります。
もう一度同じ操作を行うことで、最初の一画像のみの表示に戻ります。
■制限について
以下のような制限があります。ご了承の上でご使用願います。
- 当然ながら、スクリプト(JavaScript)が有効な環境でないと動作しません。
- 確認したブラウザはSleipnir2.5.12(IEエンジン)、IE6 SP2、Firefox 2.0.0.3、Opera 9.10(全て WinXP SP2上)のみです。それ以外のブラウザでは動作確認していません(し、動作しない可能性が高いです)。
また、上記ブラウザであっても動作保証は一切ありません。自己責任でお使いください。
- IE6 SP2では、実行直後に表示されるウィンドウ上では、なぜかマウスホイールが効きません(同じエンジンを使っているはずのSleipnirではOKなんですけれど……)。
お手数ですが、一旦ウィンドウをクリックして隠し、再度画像リンクをクリックして下さい(これ以降は効きます)。
なお、ブックマークレットのURLのvar cocoPictPop1st=trueのtrueをfalseに変えておけば、ウィンドウを隠す手順が省略できます。
- ウィンドウの大きさは最大800×600です。これより縦又は横幅が大きな画像は縮小されます。
【2007/05/01】元サイズで表示することも出来るようになりました(上記参照)。
- 画像はJPEG・PNG形式(拡張子*.jpg、*.jpeg、*.png)で、ページ上から直リンクされたもの又はページ上でimg要素として直接表示されているもの(リンクはされていないもの)が対象です
後者はリンクに変換されます。なお、この条件にあてはまっていても正常に表示されない場合もあります。
- ウィンドウ内での前後画像への移動はマウスホイールでしか出来ません。
- フレームを使ったページには対応していません。
→【2007.06.02】フレーム分解用ブックマークレットを試作してみました。
2007/04/30(月) 01:55 | 固定リンク
|
| トラックバック (0)
2007年4月24日(火)
ざっと使ってみて、気付いた点など。
- 動画アップロード自体はお手軽に出来る。動画ファイルを指定して、タイトル・コメント・タグ(キーワード)を入れるだけ。
- アップロードの途中でエラーメッセージが出て失敗する場合があった(12回中1回)。
- アップロード完了後にFlashへの変換を行っているようで、一覧に反映されるまでタイムラグが有る。
- Flash変換の質はあまりよくない気がする(映像粗い割に、重いので、再生でひっかかる)。
- プロフィール画像が何故か形式が違うと言われてアップロード出来ない(JPEGだし・サイズも守っているはず)。
- 動画は、@niftyビデオ共有のページからココログへ記事の形で投稿することが可能。ただし、この機能を使うと1動画/1ファイルになるし、タイトルと本文しか書けないので(投稿後の編集はもちろん普通にできる)、記事投稿画面はココログの管理画面から別に開いて、動画のHTMLタグをコピペする方がよいかも。
- 動画のHTMLタグはJavaScript使用が前提。
まだちょっと不満が多いかな……βが付いていることだし、今後の改善に期待。
2007/04/24(火) 01:36 | 固定リンク
|
| トラックバック (0)
2007年4月19日(木)
私はそもそもWebが見られるような携帯電話等所持していないのでよくわかりませんが、どうも、ココログが先日携帯に対応したのに伴って、携帯からのアクセスが、アクセス解析の結果に反映されなくなったらしいですね。
ただ(PCからですが)携帯用のページを見てみると、アクセス解析用のタグは埋めこまれているので、解析データそのものは取得しているのではないかと推測しています。
待っていれば、そのうち、携帯からのアクセス解析結果も見ることが出来るようになるのではないでしょうか(もちろん、保証の限りではありませんが)。
ちなみに、例えばこのブログの一つ前の記事(記事ID:18032746)の場合、アクセス解析用のタグは、
【PC用】
<img src="http://ax2.a.tea-nifty.com/ax.gif?furyu&b183557&18032746" width="1" height="1" alt="" />
【携帯用】
<img src="http://ax2.a.tea-nifty.com/ax.gif?furyu&m183557&18032746" width="1" height="1" alt="" />
ブログIDを指定する引数が“b183557”と“m183557”と、bかmかの違いがあるだけですね。
2007/04/19(木) 02:36 | 固定リンク
|
| トラックバック (0)
2007年4月17日(火)
朝目が覚めたとき、なぜか頭に『高見沢みちる』という単語が浮かんで困惑する。
悩んでてもしかたないので検索をかけると……そっか、TV版『
ねらわれた学園』だったか。
それにしても、確かこれで原田知世にはまったはずなのに、どんな話だったかまるっきり覚えていない(苦笑)。
原作も読んだはずなのだが。
かすかに記憶に残っているのは、原田さん演ずる和美(役名も忘れてた)が、机から落ちた鉛筆を空中で留めてそっと拾い上げるシーンと、奇抜な(笑)格好をした本田恭章(そういや、そもそも当時姉が彼にはまっていた影響で見はじめたんだ、このドラマ)が独特の調子で『高見沢みちる』と呼びかけるシーンだけ。
今見たら、原田さんよりも高見沢みちること伊藤かずえさんに傾きそうな予感。
2007/04/17(火) 09:01 | 固定リンク
|
| トラックバック (0)
2007年4月16日(月)
ここ数ヶ月で、何回か発生しているのが、
- 保留設定にしていないにも関らず、トラックバックが保留されてしまう。
- コメント通知が届かない。
という現象。
2.の方、4/15についたコメントのうちの一件で発生したのですが、これが狙ったかのようにSPAMコメント。
おかげでしばらく気がつかず、非表示にするのが遅れてしまいました。
実はSPAMと判断したのでコメント通知は出なかったが、ミスでコメントとしては登録されてしまった、とか?
相変わらず、記事投稿から反映されるまでの時間は長いし、思わぬところで(ファイルマネージャでフォルダを辿っているときとか)突然ログイン画面に戻ったりとか、システムの安定感という意味でもいまいちですね。
2007/04/16(月) 08:19 | 固定リンク
|
| トラックバック (0)
2007年4月13日(金)
『ココログからのお知らせ』の検索ボックスですが、Googleで「ココログからのお知らせ 検索」といったキーワードで
検索をかけてみると、
- 検索が出来るようになって便利になった。
- サイドバーの『ココログからのお知らせ』は表示しないようにしているので、使えなくて残念。
といった意見もちらほらと見受けられます。
へぇーと思ったので、それではと、単独で設置できるフォームのサンプルなど。
下記のコードを、サイドバーのメモリストなどに貼り付けます。
<script type="text/javascript">
var ccSiteStr = " site:" + document.getElementsByTagName('h1')[0].getElementsByTagName('a')[0].href;
function ccSearchSubmit() {
document.ccSearch.text.value = document.ccSearch.text.value.replace(ccSiteStr,"");
if ( document.ccSearch.select.value == "site" ) document.ccSearch.text.value += ccSiteStr;
return true;
} // end of cocoSubmit()
</script>
<form name="ccSearch" onsubmit="javascript:return ccSearchSubmit()" action="http://search.nifty.com/cgi-bin/search.cgi" method="get">
<input type="hidden" name="cflg" value="検索">
<input type="hidden" name="ss" value="cocowin">
<select name="select">
<option value="site" selected>このブログ内で検索</option>
<option value="62">ブログ全体を検索</option>
<option value="2">ウェブ全体から探す</option>
</select><br />
<input type="text" name="text" id="CCSEARCHBOX" style="width:100px; color:#808080" onblur="javascript:if(this.value.match(ccSiteStr))this.value=this.value.replace(ccSiteStr,'');if(this.value=='')this.value='キーワードを入力';this.style.color='#808080';" onfocus="javascript:if(this.value.match(ccSiteStr))this.value=this.value.replace(ccSiteStr,'');if(this.value=='キーワードを入力')this.value='';this.style.color='#000000';" maxlength="255" size="16" value="キーワードを入力">
<input type="submit" name="submit" value="検索">
<div style="font-size:12px">powered by <a href="http://www.nifty.com/search/" target="_blank">@search</a></div>
</form>
すると、下記のような感じの検索フォームが表示されるようになります。
ちなみにJavaScriptが有効になっていないと動作しません。
ついでに、拙作『
ココニール』検索フォームも。
<script type="text/javascript">
function ccnGetUrl() {
document.cocoNiiruSearch.url.value = document.getElementsByTagName('h1')[0].getElementsByTagName('a')[0].href;
return true;
} // end of cocoSubmit()
</script>
<form name="cocoNiiruSearch" onsubmit="javascript:return ccnGetUrl()" action="http://furyu-tei.sakura.ne.jp/cgi-bin/cocoNiiru.cgi">
<input type="hidden" name="url" value="" />
<input type="text" name="query" style="width:100px;color:#808080" onblur="javascript:if(this.value=='')this.value='キーワードを入力';this.style.color='#808080';" onfocus="javascript:if(this.value=='キーワードを入力')this.value='';this.style.color='#000000';" maxlength="255" size="16" value="キーワードを入力" />
<input type="submit" name="submit" value="検索" />
<div style="font-size:12px">powered by <a href="http://furyu-tei.sakura.ne.jp/cgi-bin/cocoNiiru.cgi" target="_blank">ココニール</a></div>
</form>
こちらは、下記のような感じの検索フォームになります。
こちらをJavaScript無効の環境でも動かしたい場合は、
<input type="hidden" name="url" value="" />
のvalue=""を、value="http://(自分のココログサイトトップ)/(ブログ名)/ "に変更します。
後は、やっぱりはずせない真打『
ココログ最強検索』。
最近、ブログパーツ(ココログのWidgets)対応になったため、誰でもお手軽に設置できます。おすすめです。
2007/04/13(金) 22:33 | 固定リンク
|
| トラックバック (0)
2007年4月12日(木)
設置方法ですが、
- 個別ページにカテゴリ内の最近の記事が表示されていない場合、FAQ:固定リンクに同一カテゴリーの記事が表示されないんだけど?をよく読んで、表示される設定に変更する。
- 管理画面の『記事の作成 > 新規投稿』画面にて、以下のブックマークレットを実行する。
- サイドバーのカテゴリーよりも後方のHTMLが設置できる箇所(メモタイプのマイリスト等)に、
<script type="text/javascript" src="http://furyu.tea-nifty.com/script/cocoCatTreeR.js"></script>
<script type="text/javascript">
<!--
cocoCatTree.reverse = false ; // 並び順を逆にしたいときは true
cocoCatTree.showNum = 2 ; // 同一カテゴリー内の表示数(最大5)
cocoCatTree.newDay = 3 ; // class="new"が付く日数(0は無効)
cocoCatTree.showDate = false ; // 日付表示を行う場合は true
cocoCatTree.init() ;
//-->
</script>
を貼り付ける。
ツリー表示をするには、カスタムCSSに、
ul ul.tree {
list-style: none;
margin: 0px;
padding: 0px;
}
ul ul.tree li {
margin: 0px;
padding: 0px 0px 0px 16px;
font-size: 100%;
background-image: url(http://furyu.tea-nifty.com/script/29.gif);
background-repeat: no-repeat;
}
ul ul.tree li.end {
background-image: url(http://furyu.tea-nifty.com/script/30.gif);
}
のような記述を行います。
"NEW"マーク(画像)を付けたい場合には、次のようにします。
#archive-category .tree .new { /* カテゴリー中最新記事 */
list-style: none inside url(表示したい画像のURL);
}
【注意】
拙作
【ココログ】アーカイブページに目次とページングを付加するJavaScriptと併用する場合で、そちらの設定が
cocoPView.modifySidebar = true; // サイドバーのバックナンバー/カテゴリーを置換する
cocoPView.usePullDownMenu = false ; // バックナンバー/カテゴリーをプルダウンメニューにする
となっているときは、上記の
cocoCatTree.init() ;
を
削除(または頭に//をつけてコメントアウト)し、代わりに、目次の方の設置用HTMLで、
cocoPView.init_onload() ;
もしくは
cocoPView.getArchivesRequest() ;
cocoPView.makePages() ;
となっている箇所の
前に
cocoPView.onCompleteSidebar = function(){cocoCatTree.init();} ;
という一行を
追加(挿入)して下さい。
手順 2.のブックマークレットは、実行すると、
http://[サイトトップ]/[ブログ名]/include/catrecent.html
というファイルを作成します。
これは、
<!--#include virtual="/[ブログ名]/include/cat[カテゴリID].inc"-->
を、カテゴリの数だけ並べただけのものなのですが(いちいちカテゴリIDを調べるのが面倒だったので自動化しただけ)、拡張子をhtmlにすることで、SSIで展開された後のものが取得されることになります。
ちなみに、上記のcatrecent.htmlは、これ自体をSSIで読み込むことも出来ますので、適当な記事に
<!--#include virtual="/[ブログ名]/include/catrecent.html"-->
を貼り付けてやったりも出来ます。
このようにした記事を常にトップに表示するように設定しても良いかもしれません。
2007/04/12(木) 02:47 | 固定リンク
|
| トラックバック (0)
ですので、ブログ内の適当なところ(記事中等)に、
<!--#include virtual="/[ブログ名]/include/cat[カテゴリID].inc"-->
のようなものを貼り付けておくと、SSIにより"cat[カテゴリID].inc"の内容が展開されて、最新記事を表示することが出来ます。
【例】<!--#include virtual="/annex/include/cat5251770.inc"-->
カテゴリIDとカテゴリ名の対応は、例えば管理画面の『 記事の作成 > 新規投稿 』画面を開いて、ページのソースコードを表示し(IE6の場合は右クリック→ソースの表示(V))、「select class="category"」で検索、その下の方にある
<option value="[カテゴリID]">[カテゴリ名]</option>
を調べればわかります。
2007/04/12(木) 02:00 | 固定リンク
|
| トラックバック (0)
2007年4月10日(火)
2007/04/10(火) 23:58 | 固定リンク
|
| トラックバック (0)
2007年4月07日(土)
3/26より、サイドバーの「ココログからのお知らせ」に
検索ボックスが追加されていますが、
- すでに自前で検索フォームを設置しており、重複する。
- ヒット率が悪い。
- 検索結果ページの広告が煩わしい。
といった理由で無用の長物だと感じている方もおられるかと思います。
というか、私自身がそう感じたので(苦笑)、これを隠すスクリプトを作成してみました(笑)。
設置方法は、サイドバーのメモリスト等、HTMLを記述可能なところに、
<script type="text/javascript" src="http://furyu.tea-nifty.com/script/cocoModSearch.js"></script>
のようなものを貼り付けます。
上記だけだと芸がないので、おまけとして拙作『
ココニール』用検索窓に置換するオプションもつけてみました。
この場合は、以下のようなものを貼り付けます。
<script type="text/javascript">
var cocoModSearch='cocoNiiru';
</script>
<script type="text/javascript" src="http://furyu.tea-nifty.com/script/cocoModSearch.js"></script>
なお、ココログフリーの場合には、
利用規約の、
(17)blog上にニフティ所定のテキスト広告が表示された場合、当該広告を改変又は削除する行為。
にご注意の上、設置する場合には自己責任にてお願いします。
私的には、検索ボックスはテキスト広告には該当しないものという認識ですが、自信はありません。
2007/04/07(土) 10:38 | 固定リンク
|
| トラックバック (1)
2007年4月01日(日)
そういえば、いつから新聞部にご在籍に?>蔦子さん、笙子ちゃん。
P.29・183……いや、確かに、新聞部の腕章をしている蔦子さんという描写もかつて存在しましたが。
2007/04/01(日) 00:09 | 固定リンク
|
| トラックバック (0)