Bonjour!

« 2004年8月 | トップページ | 2004年10月 »

2004年9月

2004-09-21

折り畳みで「続きを読む」(軽量化版)

以前公開した「折り畳みで「続きを読む...」」javascriptですが、Opera7系で [続きを表示] が表示されない不具合があったこともあり、オプション機能を排除したシンプルなバージョンを作りましたので暫定公開します。(ココログなどのTypepad系用です)

このjavascriptを設置すると、一段落目の後(記事タイトルの次の要素の直後)で折り畳まれるようになります。また、記事本文中に水平線(HRタグ)がある場合はそこで折り畳まれますので、折り畳みたい位置を自由に指定することもできます


このスクリプトは、もう古くなりました。新しいのはこちら↓(2005年)
[f-] 折り畳みで続きを読む(ブログ人の新HTML対応?版)
(ココログもコレでとりあえず)


設置方法は、本文より後(ココログの場合:右サイドバー)にあるHTMLを書ける所(同:マイリスト[リンク型など]のメモ欄[要「テキスト表示」に設定])に下記の呼び出しスクリプトをコピー&ペーストして反映させてください。

<script type="text/javascript" src="http://facet.cocolog-nifty.com/divers/foldContent00a.js">
</script>

自サイトに持っていきたい方は、以下のリンクからスクリプト本体をどうぞ。

foldContent00a.js

# 上記の呼び出し呼び出しスクリプトのURLも変更が必要です。
# 以前のような、44行目の//を消すという作業は不要にしました。

[続きを表示]の文字などをカスタマイズしたい場合は、自サイトにスクリプト本体をアップロードする必要があります。上記のスクリプト本体をダウンロード後、メモ帳などでファイルを開き、最上部にある該当部分を書き換えて(アルファベット以外の場合はUTF-8で)保存してからアップロードしてください。

# 最初からこのバージョンを出せばよかったですね...orz

★水平線を使う場合の注意:
- 自動改行している場合は、<hr />タグの前後に必ず空行を一行おいてください。
- タグを手打ちしている場合は、前後の文章とは別の要素としてhr要素を記述してください。
# hrタグと文章を同じタグ内に同居させてしまっている場合にどうなるかは自分でもよくわかっていませんので、不具合があれば御連絡いただければ幸いです。

# Opera7.53/7.23で動くようになったようです。

2004-09-18

そういえば2、3日留守にするんでした

なので、しばらくコメント等にレスできないと思いますが、是非お気軽にコメント下さい。
 
→ facet-divers: サイドバー折り畳み2:状態保持機能について
 
義理の両親宅へ、娘を届けに行きます。もうすぐ出発です。

サイドバー折り畳み2:状態保持機能について

正式公開しました。
facet-divers: サイドバー折り畳み2:状態保持機能付き
動作確認にご協力いただいた方々、どうもありがとうございました(^^)

修正したばかりの、ココログ及びブログ人(などTypepad系?)用スクリプト「サイドバー折り畳み2」ですが、先日拝見したyujiroさんという方の記事のお蔭で、ようやく「状態保持」機能を付けることができました。ずっと欲しかった機能なので、めちゃくちゃ嬉しいです。
 
小粋空間: サイドメニュー折りたたみ状態保持スクリプト

で、ちゃんと動いているような感じなので、スクリプト本体(foldSidebar02a.js)を差し替えてもいいかなと思ったんですが、今回は普通の修正と違って機能の追加なので、みなさんにお伺いしてからにしようと思い、この記事を書くことにしました。

お伺いしたいのは、以下の3点です(2.と3.は、現在既にご利用の方へ)。

1. このブログで、ちゃんと動いているでしょうか。

今、状態保持機能を適用してあるので、適当にサイドバーのボタンを押して開閉した後、ページをリロードしてみてください(要Cookieです。Cookieがオフの場合や初来訪の場合は、従来通り、ブログオーナーが指定した通りになります)。ご利用の環境とともにご一報いただければ幸いです。

2. ご自身のブログに折り畳みを適用されている方で、人柱になってもいいよという方がいらっしゃいましたら、是非お願いします(^^;。

適用の仕方は、 http://.../foldSidebar02a.js のところを http://facet.cocolog-nifty.com/divers/foldSidebar02c.js に変更するだけです。

3. 今回の機能を追加したファイルで今までのスクリプト本体 foldSidebar02a を差し替えた方がいいでしょうか。それとも、02a と 02c は別のファイルとして残して置いて上記の様に各自でマイリスト(私リスト)を書き換えた方がいいでしょうか。

これは、今回のバージョンアップ版 02c が今までの 02a より明らかにユーザフレンドリなので、不具合が少々あっても差し替えちゃっていいんじゃないかという気持ちがあることがその背景です。

ということで、コメントいただければ幸いです。

----

以下、余談です。

今、「サイドバー折り畳み2」の続編(?)も作っているんですが、2の時は「myFunctions01a.js」という外部ファイルも併せて呼び出す形にしたんですが、ふと考えてみると、myFunctions01a.js は「サイドバー折り畳み」以外でも使える関数を集めることを考えて作ったファイルなので、私のところはいいんですが、直リンクを張ってくださっている他の方のブログではページのロードが遅くなるだけで無駄なんですよね...。

そうなると、myFunctions(とかいう恥ずかしい名前のファイル^^;)にまとめるんじゃなくて、関数ごとの小さなファイルをたくさん作って(ライブラリみたいにして?)、必要なものだけ呼び出すという形の方がいいんじゃないかという気がしてきています。

ただ、そうなると、マイリストに書く「呼び出しスクリプト」が、例えば、

<script type="text/javascript" src="getNextElement.js"></script>
<script type="text/javascript" src="getPrevElement.js"></script>
<script type="text/javascript" src="getTextContent.js"></script>
<script type="text/javascript" src="getAttribute.js"></script>
<script type="text/javascript" src="setAttribute.js"></script>
<script type="text/javascript" src="getElementsByClassName.js"></script>
<script type="text/javascript" src="makeFoldButtons.js"></script>
<script type="text/javascript" src="foldSidebar.js"></script>
<script type="text/javascript" src="countListItems.js"></script>
<script type="text/javascript">
<!--
foldMark = "-";
unfoldMark = "+";
switchStyle = "float:right;padding:0px;margin:0px;width:1.4em;height:1.4em;line-height:1em;text-align:center;";
labelStyle = "letter-spacing:0.1em;";
//
pattern = "最近の|カレンダー|バックナンバー|カテゴリ|contact|検索|scripts|ココログ|blog";
makeFoldButtons(pattern);
//
pattern = "コメント|トラックバック|カレンダー|バックナンバー|カテゴリ|contact|scripts|ココログ|blog";
foldSidebar(pattern);  
//
counterPrefix = "(";
counterPostfix = ")";
counterStyle = "letter-spacing:normal;color:silver;";
//
pattern = "最近の|バックナンバー|カテゴリ|contact|検索|ココログ|scripts";
countListItems(pattern);
//-->
</script>

なんて、ながーくなってしまうんですよね。これでいいんだろうかと小一時間。いや、小一ヶ月?

うーん。

今回のバージョンアップでも、CookIie周りを別ファイルにしたほうが明らかに使いまわしが効く(間違いなく「本文折り畳み」でも再利用できます)ので、foldSidebar02a→02cへの変更とともに、その別ファイルを呼び出すHTML(例えば <script type="text/javascript" src="handleCookies.js"></script>)も書き足してもらう形にしようと思ったんですが、今の状態が中途半端だからなあと思いなおし、見送ることにしました。

やるなら、上記の呼び出しスクリプトの記述のように、徹底的に小分けしてたくさん呼ぶようにするという方針に腹を決めてからの方が良いかと。

まとめる方が設置が簡単。バラす方がページの読み込み時の無駄が減る。虚栄心と公共心の狭間で葛藤する私...

まあ、今の02cが無駄にでかいと言ってもまだ10K。A9のhomeScripts1.jsの63Kには遠く及びませんですよ。(笑 ... orz

----

あと、今回の02cに組み込んだcookie周りの関数は、上記yujiroさんの記事にあったものそのままなんですが、こういう風に組み込んじゃっていいのかどうかも悩んでます。差し替えずに、公開も控えた理由の一つがその辺にもあります。

実は、myFunctionsにある_getInnerText()もどこかで拾ってきた奴なんですが、これは、その時はそういうことに思い至る程の知識もなかったので、時既に遅し(T_T)。

このあたりの、他の人が考えた細かい部品の再利用のマナー(?)なんかもちゃんとしなきゃと思うんですが、みなさんどうされているんでしょうか。アドバイスいただければ幸いです_(._.)_。>ご存知の方

2004-09-14

日記/午後も通園、折り畳み

昨日から娘に午後も幼稚園に通わせることにした。

今まで午前中だけだったのだが、とても楽しいようで、いつも帰宅時にぐずるし、午後は機嫌が悪いので、ちょっと早いかとも思ったが、そうしてみた。

ところが今日は、12時に帰ってくるなり、眠い眠いといいだして、お昼ご飯もそこそこに寝始めてしまった。

13時半の再登校時にはほぼ爆睡していたので、幼稚園に電話をして相談をした。起きたら行った方がいいのか、どうなのかと。結果、来るなら一時半に。遅れるなら来ない方がいい、とのことだったので、今日の午後は休ませることにした。

ということで、午後の通園二日目にして、早くもサボり(笑)

...一時半に行ってもまずお昼寝するだけなんだけどなあ。

----

ところで、今日は、先日修正版をアップしたばかりなんだけど、サイドバー折り畳み2に「状態保持」機能を付けてみた。

小粋空間: サイドメニュー折りたたみ状態保持スクリプト」という記事を見てしまって、羨ましくて我慢できなくなってしまったからだ(^^;。

スパゲッティに苦戦させられたが、なんとか組み込むことができた。
(自分好みに開閉した後、リロードしてみてください。うまく働いてくれているでしょうか...)

しかし、本当にもうこのスクリプトはダメだ...。

2004-09-12

サイドバー折り畳み2 また修正しました

拙作「サイドバー折り畳み2」ですが、先日nokoさんからいただいたお問い合わせのお蔭で、スクリプト本体(foldSidebar02a.js)の問題箇所が判明しましたので、修正し、アップロードしなおしました。

今回のアップデートでは、Internet Explorer 6(など?)で、マイリストのタイトルが半角スペースだけのものがある場合にデフォルトの折り畳み指定が効かないという不具合を修正したつもりです。もしまだ問題があるようでしたら御一報ください。

また、スクリプト本体をダウンロードして自サイトにアップロードしてお使いの方で、問題のあった方は、ダウンロード&アップロードしなおしてみてください。_(._.)_

スクリプト本体→foldSidebar02a.js

他の不具合を報告していただいた方も、同じ部分のミスが原因だった可能性もありますので、ご確認いただければ幸いです。

nokoさん、本当にありがとうございました(^^)

2004-09-04

下書き記事を現在日時にセット!

投稿状態の初期設定を「下書き」にしている場合、下書き記事をいざ公開しようとすると、
 
+ 時計アイコンをクリックしてカレンダーを開く
+ 時刻を入力し(午前午後を選んだり日付もクリックし)てから「日時を設定」
+ 記事の状態を「今すぐ公開」にセット
+ 「保存」ボタンを押す
 
という手順を踏まなくてはいけなくて、非常に面倒です。「現在日時にセット」みたいなボタンがあればそれで事足りるのになあ…

…と思ってbookmarkletを作ってみました。ココログ専用。(ブログ人など、他のTypepad系も使えるかもしれませんが)

以下のリンクをブックマークしておき、記事編集画面で必要になった時に使ってください。

現在日時にセット!

# 日時の表示形式が変わりますが、送信データの方は大丈夫です。

----

で、これを使っていて気がついたんですが、どうせなら「今すぐ公開」にセットして「保存」ボタンを押すところまでやってくれればもっと楽じゃないかと。

ということで、「保存」ボタンを押すところまで全自動でやってくれるbookmarkletも作ってみました。

現在日時で今すぐ公開!

----

でも、「保存」ボタンまで自動で押されてしまうのはなんだかなあ……とか考えてしまったので、そういうのも作ってみました。

現在日時で公開準備!

記事の状態を現在時刻&公開にセットしてくれるので、あとは「保存」を押せば投稿完了です。

# ネーミングがいまいちですが。もう思い付きませんっ(笑)

そうそう。この最後のbookmarkletなら、「確認」ボタンを押すという選択肢も残るので、確認画面に移って目で確認してからそこで「保存」ボタンを押して投稿(公開)できるので、結構いいかもしれませんね。

---

ということで、最後の保存ボタンの代わりに確認ボタンを押してくれるタイプのも欲しかったりして?(^^;

----

(追記 2004-09-18:)
 
確認ボタンを押してくれるタイプのものも作ってみました。(笑)
 
現在日時&公開にセットして確認画面へ!
 
記事の状態が「今すぐ公開」になっているので、確認画面で「保存」を押せばそのまま公開できます。
 
# 確認画面に移る前に一瞬だけ記事の状態や日時の変化が確認できるときもあります。(^^;
# もうbookmarklet用リンクのネーミング力が...w

----

(さらに追記)

▼関連記事:

-ココログ/記事の公開日時をもっと簡単に変更する(bookmarklet)

▼更新記録:

-2006-03-29 : ココログのバージョンアップに伴い「公開日時を指定」という選択項目が増えたので追随
-2006-10-15 : 現在日時の月日時分秒が二桁ばかりの時に動作不良していたので修正

My Photoにプロフィールへのリンクを

プロフィールページ(/about.html)を見ようと思って、サイドバーに置いてある写真(My Photo)をクリックしてしまうってこと、ありませんか?

私は、My Photo の直下に「プロフィール」リンクを配置してくれてないと、忘れてすぐにクリックしてしまいます。それで「プロフィール」リンクがなかなか見つからなったり無かったりしてアドレスバーで a b o u t . h t m l とか入力する羽目になると、もうめちゃくちゃ腹が立ちます(笑)

ということで、サイドバーに埋め込んで自分のブログの My Photo をプロフィールにリンクさせてしまうjavascriptを作ってみました。Typepad系専用です。

呼び出しスクリプトは、こちら↓

<script type="text/javascript" src="http://facet.cocolog-nifty.com/divers/addLinkToPhoto01a.js">
</script>

My Photoより後に配置してください。

# スクリプト本体→addLinkToPhoto01a.js

ちなみに、このjavascript、デフォルトの「My Photo」や「プロフィール」を使わずにマイリストで/about.htmlへのリンクを追加してやればそれで済む程度の超小技。あほですね(笑)

ついでですが、考えて見ればbookmarkletも非常に簡単でした。Typepad系のブログで「プロフィール」ページを開くbookmarkletは、こちら↓

プロフィールを見る

ああ。これで「プロフィール」リンクを探したりabout.htmlといちいち入力しなくてもいいと思うと嬉しくて(T_T)

…というか、Typepad系の中の人、My Photoにプロフィールページへのリンクを張ってくれませんかねぇ。

…というか、不精者すぎ?

2004-09-03

似非■Guild員養成スクリプト

というわけでsquareZunft01a.jsとかいうスクリプトを作ってサイドバーに埋め込んで、似非■Guild員してるわけなんですが、今回、隠れているアンカーをリンク化して表示とかいうスクリプトを作って適用してしまったため、記事タイトルの頭にある■にもリンクを張りたくなってしまいました。

というわけで、squareZunftスクリプト、バージョンあっぷとともに公開します。

似非■Guild員になりたい方は、ご自由に御利用ください。そのままだとたぶん、ココログ専用ですが。(&ブログ人などTypepad系もOK?)

ココログの場合、右サイドバー(必要ならば「最近の記事」&「最近のコメント」より後)に以下の呼び出しスクリプトを埋め込めば設置完了です。

<script type="text/javascript" src="http://facet.cocolog-nifty.com/divers/squareZunft02a.js">
</script>

# 呼び出されるスクリプト本体→squareZunft02a.js

なお、「コメントリストツリー化 for ココログ & ブログ人」という素晴らしいスクリプトを「ふろむにぅじぃ」のtakkyunさんが作ってくださっていて、それも早速適応させていただいていてとても気にいっているので、このツリー化との共存もできるようにしました。共存が必要なの場合は、上記の呼び出しスクリプトを、「最近のコメント」より後で、かつ、ツリー化スクリプト(comtree.js)より後に配置するようにしてください。

----

ただし、似非組合員だからといって仁義を通さずに済ますなんてことのないように!
sketch-book: ■結成! ■Guild

# 私は捕捉されたまま放置なんで不義しまくりなんですが(^^;
# いや、似非には似非の心意気ってものがあるわけで……なんて。

使用容量:9カ月で5.44MB(18.13%)

恒例の使用容量チェック。このままなんとか一年続けられたらいいんですが、なんかペースが似通ってて、ちょっとつまらないかも。がくっと減ったり増えたりすると、このデータも面白いんですが。
 
それはともかく、コメントを書き込んでいただいた皆さん、どうもありがとうございました。_(._.)_

----

▼今回のデータ【9カ月目】

現在ご利用中のプラン: 	ベーシック
ご利用可能なディスク容量: 	30 メガバイト
ご利用中のディスク容量: 	5.44 メガバイト (18.13%)
ココログのご利用開始月: 	December 2003
記事数: 196 |  コメント数: 340 |  ライター数: 1 
(公開記事数: 186 ... つまり、下書き状態が10)

▼増分一覧表

使用容量/MB容量増加率記事数公開記事数コメント数
9カ月目+0.35164+1.17%+17+13+44
8カ月目+0.40836+1.36%+18+15+50
7カ月目+0.632+2.11%+13+12+52
6カ月目+0.280+0.93%+8+7+39
5カ月目+0.328+1.09%+7+6+43
4カ月目+0.744+2.48%+43+26+35
3カ月目+0.296+0.99%+25+16+13
2カ月目+0.928+3.09%+86+37+35
1カ月目+1.472+4.91%+121+54+29

▼過去の記録

【8カ月目】

ご利用中のディスク容量: 	5.08836 メガバイト (16.96%)
記事数: 179 |  コメント数: 296 |  ライター数: 1 
(公開記事数: 173)

【7カ月目】

ご利用中のディスク容量: 	4.68 メガバイト (15.60%)
記事数: 161  |   コメント数: 246  |   ライター数: 1
(公開記事数: 158)

【6カ月目】

ご利用中のディスク容量: 	4.048 メガバイト (13.49%)
記事数: 148  |   コメント数: 194  |   ライター数: 1
(公開記事数: 146)

【5カ月目】

ご利用中のディスク容量: 	3.768 メガバイト (12.56%)
記事数: 140  |   コメント数: 155  |   ライター数: 1
(公開記事数: 139)

【4カ月目】

ご利用中のディスク容量: 	3.44 メガバイト (11.47%)
記事数: 275 |  コメント数: 112 |  ライター数: 1 
(公開記事数: 133)

* この月のデータ記録後、下書き記事を一旦全て削除しました。

【3カ月目】

ご利用中のディスク容量: 2.696 メガバイト (8.99%)
記事数: 232 |  コメント数: 77 |  ライター数: 1 
(公開記事数: 107)

【2カ月目】

ご利用中のディスク容量: 2.4 メガバイト (8.00%)
記事数: 207 |  コメント数: 64 |  ライター数: 1
(公開記事数: 91)

【1カ月目】

ご利用中のディスク容量: 1.472 メガバイト (4.91%)
記事数: 121 |  コメント数: 29 |  ライター数: 1 
(公開記事数: 54)

2004-09-01

隠れているアンカーをリンク化して表示

ページの途中にあるアンカー部分にリンクを張りたいんだけど、いちいちHTMLソースを見るのは面倒だよなあと思ったことはありませんか?

そんな時に役立つbookmarkletを作ってみました。下のリンクをブックマークに登録して、隠れているアンカーを表示させたいときに使ってください。

隠れているアンカーをリンク化して表示

このbookmarkletを使うと、隠れたアンカーのある所に「■」が現れると同時にリンクが張られるので、それをクリックしてアドレスバーからURLをコピーしたり、右クリックメニューからアドレスをコピーできるようになって便利です。

# ただし、aタグしか見てないので、divに設定されているidなんかには反応しません。

また、これは、自サイトのHTMLソース内に埋め込むことも可能です(このブログでは、右サイドバーに埋め込んでみました)。サイトに埋め込みたい場合は、以下のようなスクリプトを、できるだけ最後の方に埋め込んでください。

# ココログやブログ人などのTypePad系の場合に記事別ページだけで隠れているアンカーを表示させたい場合には、以下のスクリプトの三行目あたりの if の前にある // を消してから御利用ください。

<script type="text/javascript">
<!--
showHiddenAnchors();
function showHiddenAnchors() {
	if(!document.getElementById('more'))return;
	var E = document.getElementsByTagName('*');
	for(var i = 0,e; (e = E[i]); i++){
		if((e.nodeType == 1)&&(e.nodeName.match(/^a$/i))&&(!e.href)&&(e.id || e.name)&&(!e.firstChild)){
			var hash = '#';
			hash += (e.id) ? e.id : e.name;
			e.innerHTML = '■';
			e.title = hash;
			e.href = hash;
		}
	}
}
-->
</script>

# このサイトでは、外部ファイルを呼び出す形にしています。
showHiddenAnchors01a.js
showHiddenAnchors01b.js

bookmarklet、jsとも、マークの「■」は、お好みで変更してください。

# 「■」にしたのは単に私が「■Guild」の(似非)組合員だからです(^^)

---

(余談)

ココログなどの記事別ページにつくコメントには、冒頭に隠されたアンカーがついていてそれぞれ固有のIDが振られていているので、HTMLソースをみることでそこに直接リンクを張ることができます。でも、いちいちソースを見るのが面倒ですよね。

幸い、私が使っているブラウザ(Firefox)には、「View Selection Source」という右クリックメニューがあって、選択した部分だけのHTMLソースを表示させることができるので割合簡単なんですが、それでも面倒だなあと思うことはよくあります。

このブログでは、その手間を省いてもらうため、トラックバックやコメントの冒頭に隠れているアンカーを表示するjavascriptを埋め込んだりしたこともあったんですが、動作がとても重かったので外してしまっていました。

で、今回、新しく作りなおしてみたわけですが、結構良さそうな感じ。すごく単純なスクリプトにしたのが良かったみたいです。

その余波でbookmarklet化することも思い付いたんですが、これがかなり便利〜。これなら、どんなページででも、隠れているアンカーをとることができますからね〜。viva! bookmarklet!

また、divにあるidなんかも取れるともっといいかもとも思ったんですが、ココログだとサイドバーに埋め込んだ時にうるさくなりすぎそうなのでやめました。bookmarkletの方は、それもあった方が便利かもしれませんね。

サイドバーの見出しの下線や枠も非表示にするjavascript:修正しました

一ヶ月前ほどに公開したサイドバーの見出しの下線や枠も非表示にするjavascriptですが、kuuさんからのコメントのお蔭で、サブタイトルやマイリストに空の所があると、それ以降が非表示にならないということが判明しました。

以下が修正してみたスクリプトです。必要な方は、差し替えてください。_(._.)_

<script type="text/javascript">
<!--
var h2s = document.getElementsByTagName("h2");
for (var i = 0; i < h2s.length; i++) {
	var h2 = h2s[i];
	if (h2.firstChild&&h2.firstChild.nodeType == 8) {
		//h2.style.display = "none";
		h2.style.visibility = "hidden";
	}
}
//-->
</script>

# 真中あたりにあるif()に「h2.firstChild&&」を付け足しただけという…(orz

これで大丈夫かなあと思うんですが、なんとなく不安(^^;。また情報をお寄せくだされば幸いです。>みなさん

# kuuさん、どうもありがとうございました〜

« 2004年8月 | トップページ | 2004年10月 »

contact

検索

無料ブログはココログ
2017年11月
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

BANNERS