砂だらけの戦果

今日はばあちゃんの家の近くに餅まきに行ってきました。
ありゃ~戦場ですね。

戦果は紅白あわせて14個!過去最高な気がする。しかもピッタリ紅白同数。
ことしは厄年の人の人数が多かったらしく(35人以上だったか?)大量の餅がまかれました。24歳以下の若者は6升分、それ以上の人は10升分の餅をまいたそうで、多分300~350升くらいまいたんじゃないだろか。1升って10合なんで、ゴハンにしたらえらい大量だな。
単位:升
ちなみに写真の餅はおそらく1個1合以上あると思います。

開始の合図に合わせてデカイ餅(直径20cmくらいかな?)がとりあえずまかれ、なんと3個くらいそんなんが飛んできて顔面にヒット・・・!

2回目の合図で普通サイズのスタートだけど、もう上向くのが怖くてへっぴり腰で下向いて、拾いまくり!それがよかったんでしょうね。たくさん拾いました。あんなのそうキャッチできるもんじゃない。落ちたの拾うのが正解ッす!なので、戦果と言うより棚から牡丹餅と言うか、まぁおこぼれです^^;

美味しく頂く事にします!

関係ないんですけど、「棚から牡丹餅」って検索したらWikipediaもどきがヒットした。よう分からんけど面白すぎる!

棚から牡丹餅(たなからぼたもち)とは、戸棚や本棚から突然牡丹餅が転がり落ちてくる怪奇現象である。

ですって。こんなん大好きだ。

誤りと嘘八百でいっぱいの百科事典。
アンサイクロペディア:Uncyclopedia

SyntaxHighlighter

WordPressのプラグインの紹介の続きって事で、今日は先日導入したSyntaxHighlighterです。記事内にソースを書く時に分かりやすく色分けしてハイライトしてくれます。
codeタグやpreタグってうまく動かないんだけど何か使い方違ってるんだろか・・・

– 導入方法 –

  • wordpress.orgのプラグインのページからSyntaxHighlighterをダウンロード
    (2008/10/14現在のVer. 1.1.1)
  • 解凍して/wp-content/plugins/にアップロード
  • Activateして完了

と思いきや動かん!また英語かと思いつつ、上記のダウンロードページを眺めているとFaqのページに

Make sure your theme’s footer has <?php wp_footer(); ?> somewhere in it, otherwise the JavaScript highlighting files won’t be loaded.

なんて事が書いてありました。
使っているテーマのフッターに<?php wp_footer(); ?>が無いとスクリプトがお仕事してくれませんよって事みたい。/wp-content/themes/使用するテーマのディレクトリ/footer.phpを確認すると無いようなので、</body>の直前に追加しておきました。
(上記のコードは初めの括弧は全角にしてあります。)

<?php wp_footer(); ?> 
</body>
</html>

これでいいかな~と思ったらまだ問題が!専用のタグで囲んだ中はリストタグで整形されているようで、それがテーマによっては都合が悪いんです。
結構そうゆうテーマ多いんじゃないかなって思うんですが、CSSでlist-style-typeがnoneにしてあって、マーカーは背景で指定してある場合。各行の先頭に背景のマーカーが出ちゃうんですね~。
どうしよっかなと思いつつ色々触るのも面倒なので、/wp-content/plugins/syntaxhighlighter/files/SyntaxHighlighter.cssの中身に1行だけ追加。

.dp-highlighter ol li, .dp-highlighter .columns div {
	list-style: decimal-leading-zero;
	list-style-position: outside !important;
	border-left: 3px solid #6CE26C;
	background:none;/*←この1行だけ追加 */
	background-color: #F8F8F8;
	color: #5C5C5C;
	padding: 0 3px 0 10px !important;
	margin: 0 !important;
	line-height: 14px;
}

無事動いているので、問題ないかな。いい感じです。

– 使用方法 –

[sourcecode language=’xhtml’]
ソースコード
[/sourcecode]

このタグで囲むだけ(こちらも初めの[は全角になってます)
language=’***’の部分を対応する言語に書き換えます。
サポートしている言語

  • C++ — cpp, c, c++
  • C# — c#, c-sharp, csharp
  • CSS — css
  • Delphi — delphi, pascal
  • Java — java
  • JavaScript — js, jscript, javascript
  • PHP — php
  • Python — py, python
  • Ruby — rb, ruby, rails, ror
  • SQL — sql
  • VB — vb, vb.net
  • XML/HTML — xml, html, xhtml, xslt

ツールチップみたいなCSS

テキストリンクにマウスオーバーした時に画像やテキストをピョコっと出したいなぁ~と言う事で、スクリプトをいろいろ探したりしながら悩み探すこと数時間。割とシンプルなCSSでいい感じの物が出来たので載せておきます。
PHPSPOTさんのところで紹介してあるものを多少アレンジした物です。

以下のサンプルページのような感じになります。
CSSでツールチップのサンプルページ
IETesterで見たところ、IE5.5は不具合があるけどそれ以外は大丈夫そうです。

HTMLソース

<ul>
<li><a href="index.html" class="tooltip">テキスト<span>
<img src="exmple1.jpg" alt="例1" width="60" height="45" />ツールチップ内テキスト</span></a></li>
<li><a href="index.html" class="tooltip">テキスト<span>
<img src="exmple2.jpg" alt="例2" width="60" height="45" />ツールチップ内テキスト</span></a></li>
<li><a href="index.html" class="tooltip">テキスト<span>
<img src="exmple2.jpg" alt="例3" width="60" height="45" />ツールチップ内テキスト</span></a></li>
<li><a href="index.html" class="tooltip">テキスト<span>ココはテキストのみにしてみた</span></a></li>
</ul>

CSSソース

a:hover {
	background:#ffffff;
	text-decoration:none;
}
a.tooltip span {
	display:none;
	padding:5px;
	margin-left:8px;
	width:200px;
	height:auto;
}
a.tooltip:hover span {
	display:inline;
	position:absolute;
	background:#fffaf0;
	border:3px double #a0522d;
	color:#583822;
	font-size:0.8em;
	line-height:1.3;
}
a.tooltip:hover span img{
	float:left;
	border:none;
	margin:0px 7px 5px 0px;
}

CSSはほとんどサイズ調整とか装飾なので必要なのは少しだけですね。スクリプト使わなくても意外とシンプルに出来るもんです。

2008/10/16追記
ロボットが隠しテキストと見なしてスパム扱いするかは不明ですので、ご注意を。ユーザビリティでした事であって、意図した隠しでなければ問題ないと思いたいです。
あと、音声ブラウザはdisplay:none;の中身を読まないみたいですが、今回みたいな指定の場合はどうなのでしょうか?その辺も不明です。

Shape Of My Heart

良すぎじゃない?またレオンが見たくなった。
Shape Of My Heart
(ソース貼り付けても携帯では表示されないので、モバイル用にYouTubeのリンクです。パケ死に注意!)

歌の全体的な内容とは違うんですが、最近思うんです。
「But that’s not the shape of my heart」と。