2013年2月 3日

隠居のブログ備忘録:JQuery lightbox 2.51 をカストマイズする

 
 昨年夏に、サムネイル写真をクリックするとウインドウ中央に写真が拡大表示される Llightbox を jQuery という JavaScript のライブラリーを使用した Lightbox2.51 を導入した。
 その時、カストマイズしたのは、デフォールトでは黒である背景画面の色を緑にしたのと、写真ページを閉じるボタンを デフォールトのclose.png から、自作の closelabel.gif に変更しただけである。

 私が管理している友人の Lightbox は、prototype.js という JavaScript のライブラリーを使った旧バージョン Lightbox2.0 を使っている。背景画面に、蝶をあしらった壁紙を使っていて、これを Lightbox2.51 で使う方策が分からなかったからである。
  Lightbox2.51 のカストマイズは、【jQueryのlightBoxプラグインの使い方】【jQuery LightBox Pluginの使い方】 などに詳しい。これらのプラグインは、新たに JavaScript を付け加えてカストマイズする方法である。だが、私のやり方が悪かったのか上手く行かなかった。
 そこで、当初導入した時にいじったJavaScript lightbox.js と スタイルシート lightbox.css 再度いじって見ることにした。 私にコードが理解できるわけではないから、やりかたは ここはと思われるスクリプト ないしは CSS をいじって、FTP でサーバーにアップロードし、実際のページでの変化を観察する方法である。幸い、JavaScript と CSS の変更は、すぐにページに現れるから楽である。この結果を備忘録として記録しておきたいと思う。

  1. 自作の closelabel に置き換える。
    lightbox.js の41行目を下のように独自の画像に置き換える。
          this.fileCloseImage = 'http://n-shuhei.net/atelier/Jquery2.51/images/closelabel.gif';

  2. セットで写真を表示している場合の表示を "image"(default) から "画像"に置き換える。44行目
          this.labelImage = " 画像 "; 

  3. セットの写真の何枚目を示す、表示を例えば "1 of 8" を " 1 / 8 "に置き換える。45行目
          this.labelOf = "/";  

  4. 背景画面を単一色から、壁紙画面に変える。lightbox.ccs の7行目あたりの背景色をコメントアウトして、壁紙イメージを挿入する。
    /*  background-color: #000000; */
    background-image: url("http://n-shuhei.net/atelier/lightbox2/images/overlay_1.jpg") ; 

  5. 画像の枠(台紙)の色をかえる。lightbox.ccs の35行目あたり。デフォールトは、"white;"
       background-color: #ffffe0;

  6. 画面の"前画面" "次画面" へのボタンを独自のボタンに置き換える。lightbox.ccs の112行目、117行目あたり。 
        background: url(http://n-shuhei.net/lightbox2/images/prevlabel.gif) left 40% no-repeat;

    background: url(http://n-shuhei.net/lightbox2/images/nextlabel.gif) right 40% no-repeat;

  7. 写真の説明文字の色を変える。lightbox.ccs の145行目あたり。デフォールトは灰色。
     color: #ffffff;

 その他、細かい部分も、CSS をいじることで変えられそうだ。
サンプル画像は、次のエントリー【隠居の探鳥ウォーク:ハリエンジュ 花芽ついばむ 鷽(ウソ)4羽 】などで確認できます。

  

2012年7月17日

隠居のパソコン備忘録: jQuery lightbox (同一画面上に拡大写真をかっこよく表示する)を導入する


 先日来、個人的地図作成サービス Google Maps API V3 を学習してきた。このサービスを使って、加賀地方旅行地図を作成したことを記録している。このサービスを学習中に、jQuery という JavaScript のライブラリーが、いろいろな JavaScript ソフトを導入するときに使われていることが分かった。

 この JavaScript ライブラリーの jQuery を使って、拡大写真の表示を同一画面上に表示する JavaScript の lightbox が新しいバージョン(Version 2.51)になっていることも分かった。(従来のライブラリーは、prototype.js )
 これを、先の加賀地方旅行地図での写真表示に使って見ることにした。
サンプル画像

 インストールについては、Lightbox2 のページから、Lightboxv2.51 をダウンロードし、PC のどこかのフォルダ(例えば、lightbox2.51 を作成し )に解凍する。
  上のページの【How to use】を参考に、ブログをアップロードしているサーバーに新しいフォルダー(例えば、lightbox2.51 )を作成し、ファイル転送ソフト(私の場合、FFFTP )を使ってサーバーにアップロードする。解凍したフォルダーをまるままアップロードしても問題は無いと思う。ただ、サーバーに余裕がない場合には、先ほどのページを参考に、必要なファイルのみをアップロードしたほうが良い。このあたりは、【アクアラングウエスタンver.9.2】というページを参照させてもらった。

 このようにして、lightbox2 が動作するのを確認の上で、次のようなカスタマイズを行った。
  • 初期値では、写真を表示する画面の背景色は黒であるが、これを好きな色に変えるには、lightbox.css の冒頭にある次の青字部分を変更する。
    /* line 6, ../sass/lightbox.sass */
    #lightboxOverlay {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 9999;
      background-color: #408080; 元は、black;
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
      opacity: 0.85;
      display: none;
    }
    


  • 写真ページを閉じるボタンを close.png(close.png) から、自作の closelabel.gif(closelabel.gif) に変更した。変更は、lightbox.js の50行目あたりある次の青字部分を変更した。なお、赤字部分で示したように、imageのありかは、絶対パスで書いておいたほうが無難なようである。
      LightboxOptions = (function() {
        function LightboxOptions() {
          this.fileLoadingImage = 'http://n-shuhei.net/xxxxx/Jquery2.51/images/loading.gif';
          this.fileCloseImage = 'http://n-shuhei.net/xxxxx/Jquery2.51/images/closelabel.gif';
          this.resizeDuration = 700;
          this.fadeDuration = 500;
          this.labelImage = " photo  "; 元は、Image 
          this.labelOf = "of";
        }
    


 この Jquery lightbox2 を、Movable Type 4 で作ったブログの写真(多分1000枚以上ある)の表示に適用した。(従来は、prototype.js の lightbox 2.0 ) Movable Type に適用するには、テンプレートのヘッダーにある lightbox 2.0 の Javascript 表示を lightbox 2.51 のコードに置き換えるだけで、すべての写真表示が新しい lightbox2.51 の表示となるので極めて楽ちんである。(つまり、HTML でのコードは、 lightbox 2.0 でも lightbox2.51 でも同じである。)

2010年3月21日

隠居のMT備忘録:Lightbox のカスタマイズ

Internet Explorer 8(IE8:WindowsXP)に変えてから、私が管理しているブログのうち2つのブログ(Atelier Shuhei Weblog と Studio YAMAKO) メインページで lightboxの不具合が起こった。背景が黒くならない。個別ページでは、正常に表示されている。ただ、管理している3つのブログの一つ、Masjii's Blog では上手く機能している。
今まで学習したことを調べたり、ネットでサーチしてみても原因がわからない。両者のソースコードやStylesheet を1ヶ月以上かけて仔細に調べてみたが、全く解決の糸口が見つからなかった。

 先日、Atelier Shuhei Weblog をIE8 のWindows画面を開けようとすると、次のようなエラーメッセージのポップアップ画面が出て停止した。
HTML Parsing Error: Unable to modify the parent container element before the child element is closed

 このエラーについて調べると、どうやら DOM という API に関連しているらしい。DOM については全く知識がないが、どうやらプログラムとくに JavaScript の実行順序が起因しているように思われた。
そこから類推して、Atelier Shuhei Weblog Studio YAMAKOのメインページには、JavaScript を多用した Lightbox で開く写真が沢山あるので時間がかかるのではないか、それが原因ではないかと思われた。Masjii's Blog には、写真はあまりなくテキストが中心である。

 そこで、MovableType4.2 の「ブログ記事の設定」で、表示数を 30 から 10 に変更すると、写真の背景は黒くなり正常に表示されるようになった。Masjii's Blog はもともと10 ブログ記事だけの表示になっていた。メインページの表示が10 件だけでも問題は余りないと思われる。

 懸案の問題が解消したので、解決策をネットでサーチしている中で見つけた lightbox のカスタマイズを参考にいじってみた。以前にも、画面を「閉じる」「Next」「Back」ボタンをカスタマイズしている。
 今回は、写真の台紙を従来の白から薄緑色に(それに伴って、キャプチャーの文字を白に)、背景の overlay を黒一色から模様入りの壁紙風に変えてみた。 Studio YAMAKOの背景は、蝶の柄が入った壁紙にしてみた。私のは青空である。
 三つを並べてみたい。
sample1:Atelier Shuhei Weblog sample2:Masajii's weblogsample3:Studio Yamako

2008年9月21日

隠居のMT備忘録:lightbox 2.0 の背景 overlay が黒くならない

 lightbox 2.0 の最新バージョン 2.04 の導入は失敗した。導入の手順を間違ったものと思うが、サイトそのものにアクセスできないという致命的な障害がでるので、すぐに元のバージョン 2.03 に戻した。

 そのときのドサクサにまぎれてテンプレートなどをいじったせいか、次の条件のときに、画像が現れるポップアップ画面の背景 overlay が黒くならないという現象がでた。
  • Windows XP SP2
  • Internet Explorer 7
  • MovableType 4.1 テンプレート:小粋空間:two-column-liquid-right メインページ
 アーカイブページやWindowsVista Mozilla(Firefox) では起こらない。
 上記は私の環境で、それ以外については確認していない。

 lightbox2.0 のページの support では、overlay については次の説明がある。

The shadow overlay doesn't stretch to cover full browser window.
Remove the default margin and padding from the body tag. Add body{ margin: 0; padding: 0; } to your stylesheet.

 スタイルシートでは、この設定は既に以下のようになっており、問題はなさそうである。
/* すべて */
* {
    margin: 0;
    padding: 0;
    font-family: Verdana, Arial, sans-serif;
    word-break: normal;
    line-break: strict;
}


 ネットサーチもしてみたが、的確な示唆はヒットしなかった。見当はずれであるが、「小粋空間」さんの「Lightbox JS の Movable Type での不具合を修正する」のエントリーに、コメントとして質問を投げかけてみた。親切に以下のような返事をいただいたが、結局原因不明である。
>n_shuheiさん
こんばんは。ご返事遅くなってすいません。
事象は確認できましたが、現在のところ原因不明です。

もし何か分かりましたら別途エントリーしたいと思います。
それではよろしくお願い致します。


 アクセス解析サービスの Artisan の分析では、私のサイトへの訪問者は、WindowsXP IE6/7 でのアクセスが最も多いから、早く修復したいと思ったが方途がない。

 運営している友人の2つのブログのひとつを見ていると、なんと上の条件でも、lightbox で拡大画像表示されるポップアップ画像の背景overlay が黒くなっていることが分かった。いじっているうちに偶然うまくいっていたらしい。

 このブログも同じ小粋空間:two-column-liquid-right のテンプレートを使っているので、lightbox 表示に関連していると思われるテンプレートモジュールの「ヘッダー」を子細に見てみると、正常に表示されるブログのテンプレートの<div> タグを閉じる </div> タグがひとつ少ないことを見つけた。
 どうやら、テンプレートモジュールの「ヘッダー」で<div> タグを閉じる </div> タグを余計にひとつつけたことが原因らしく思われた。テンプレートの構成上テンプレートモジュールの「ヘッダー」の<div> タグのひとつは、テンプレートモジュールの「フッター」で閉じられることになっていたのだ。

 「ヘッダー」の余計な </div> タグを削除すると上手く背景overlay が黒くなった。原因は、まったくそのせいと思っていたが、再現性を確認するために、「ヘッダー」テンプレートに余計な </div> タグをつけても、背景overlay は黒くなる。再現性はないのだ。
 どうやら修復は不可逆性だったようで釈然としないのだが、うまく表示されるようになっているので、まあ、いいか という気分である。
 ブラウザーに依存する障害は、いつもよく分からない。

2008年9月 2日

野鳥の写真集を変更しました

 野鳥の写真サムネイルは、Kinarie&May さんの Flash MT用のフォトサムネイラーを使ってきた。このプラグインは、エントリーのカテゴリー(例えば birds )ごとに掲載されている写真をサムネイル化してくれる。

 非常に有用であるが、欠点は各エントリーに掲載されている1枚の写真かすべての写真を選択してサムネイルすることである。私のように、一つのエントリーにいろいろな写真をのせていると雑音の多い野鳥の写真サムネイルができてしまう。
 それとサムネイル化するファイルの拡張子は、小文字の jpg でなければなければならない。大文字の JPG ファイルも結構あり、修正するのは大変である。
 それで、DIY作品集のようにテーブルを利用して web page 作ることにした。

 ひとつづつのセルに写真ファイルを納めていくことは時間のかかる作業であるが、プラグインの lightbox が使えたり、録音したさえずりを再生するプレイ・ボタン を設置できたりするので自由度が高い。

 右サイドメニューに置いていた「野鳥の写真サムネイル」ボタンのリンク先を作った写真集へ付け替えた。興味のある方は、一度覗いてみてください。

 野鳥ばかり追っかけている人のブログなどに出てくる写真と比較すると余りにもお粗末であるが、それぞれの写真のリンクをたどるとその写真を撮ったTPO が分かるので懐かしい。 早い時期にデジスコの体制を整えて、もう少しましな写真集に撮りたいと思っている。 

2008年8月18日

隠居のBlog備忘録:MT4.1 での lightbox による画像の挿入を簡略化する

 最近、友人の海外旅行の写真集をブログ Studio YAMAKO に作成していることもあって、画像の挿入する機会が増えた。MT4.1 で写真を掲載することは、MT3.3 のときに比べれば少し楽になっているが、まだいろいろと操作をしなければならない。

 私の場合、写真はブログ本文にサムネイルを掲載し、これをクリックすれば画面全体がブラックアウトして、ポップアップ的に原寸の写真が表示される lightbox というプラグインを使用しているので、その分も操作が多い。そこで、私の知識でもう少し手を抜くことはできないかググッテみた。

 MT4.1 で画像の挿入操作をしたときに自動的に貼り付けてくれるHTMLコードは下のようなコードである。
<form mt:asset-id="227" class="mt-enclosure mt-enclosure-image" style="display: inline;">
<a href="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001.jpg">
<img alt="080818_001.jpg" src="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001-thumb-200x132.jpg" width="200" height="132" class="mt-image-right" style="float: right; margin:  0 0 20px 20px;" /></a></form>

今までは作成してくれたコードを、次の青字のように数カ所属性を追加したり、手を加えたりしていた。
<form mt:asset-id="227" class="mt-enclosure mt-enclosure-image" style="display: inline;">
<a href="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001.jpg" title="ABC" rel="lightbox[aa]">
<img alt="クリックすると大きな写真になります" src="http://n-shuhei.net/studio_yamako/xxxxxx/080818_001-thumb-200x132.jpg" width="200" height="132" class="mt-image-right" style="float: right; margin: 5px;" /></a></form>


 このように手を加えることは挿入する写真が多くなると結構な手間になる。
 「モバイルタイプ備忘録」の関連ページなどを参考に、perl なんてこれから晩学するつもりで全く分からないが、画像の挿入時に使われるソース・プログラムを覗いて、「秀丸」でいじってみた。
 ソース・プログラムは、/cgi/mt/lib/MT/Asset フォルダーにある Image.pm である。この320行目あたりにある行を青字のように変えた。
# '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
'<a href="%s" title="" rel="lightbox[]"><img alt="%s" src="%s" %s %s /></a>'

 私の場合、lightbox は 2.0 を使っているので、グループ表示のための [] とキャプション挿入の title="" を付け加えた。日本語文字列の「クリックすると大きな写真になります」を入れようとしたが、これは上手くいかなかった。 perl の勉強が必要のようだ。この挿入は、「だい」→「クリックすると大きな写真になります」とIME に単語登録して簡単化することにした。
 初期値では、サムネイル写真を表示するボックスの周囲に余白を作る style の margin が私の場合適切ではないので、この部分も先ほどのソース・プログラムで見つけて(279・282行目あたり)、次のように改定すると上手くいった。
# ' $wrap_style .= q{style="float: left; margin: 0 20px 20px 0;"};
    $wrap_style .= q{style="float: left; margin: 5px;"};

# ' $wrap_style .= q{style="float: right; margin: 0 0 20px 20px;"};
 ' $wrap_style .= q{style="float: right; margin: 5px;"};

 ソース・プログラムが少しいじれるようになったので、ブログつくりも面白みが増えたが、リスクとは隣り合わせのようだ。しっかりとバックアップをとってからいじるようにしたいと思う。それにしても、学習しなければならないことが多いので、もうちょっとの間はボケの進行が止まっていて欲しいと祈念している。

2007年7月 9日

lightbox のキャプションにリンクを張る

 litebox1.0 jpeg IE と揃うと写真の表示で白い点々(white noise) が出ることがあることは、以前のエントリーで記載した。それで、litebox1.0 lightbox2.0 に変更したら、 white noise が出なくなった。この lightbox2.0 の support 欄Q&Aに次のような記載があったので、導入してみた。最近のエントリー<隠居の庭:夏の花(2)>のローズアーチの写真で使っている。
Can I insert links in the caption?
Yes, but you need to convert quotes and greater and less than symbols into their html entity equivalents.
For example:
<a href="images/image-4.jpg" rel="lightbox" title="&lt;a href=&quot;link.html&quot;&gt;my link&lt;/a&gt;">Image</a>

 html entity equivalents とは、日本語で言うHTMLエンコードのことのようだが、引用の中で使った &lt; は、エントリーのフォーム(HTML)では &amp;lt; と書かないと表現されない。
 なお、HTMLエンコードするには、 lightbox2.0 のソースコードの中に、エンコードおよびデコードしてくれるページが記載されていた。日本語でも同様のページがある。ありがたいことです。

2006年7月10日

隠居の庭:ヤブカンゾウ by Litebox-1.0.js

 ヤブカンゾウはニッコウキスゲの仲間らしいが、花びらがくしゃくしゃなのが特徴らしい。決して綺麗ではない。その側に咲いている黄色のヘメロカリスは可憐である。植木鉢に植えられてから久しいマンリョウに白い花が付いている。これが、赤い実になるらしい。
 ところで、このエントリーではlightbox 2.0から発展したLitebox-1.0.jsをインストールした。実はlightbox 2.0のインストールは上手くいかなかった。「小粋空間」さんがインストール法を紹介してくれることになっていたが、その間にLitebox 1.0がでた。lightbox 2.0から画像をグループ化してスライドショウ的に見る仕様になっており、それを導入したかったのである。今回、「小粋空間」にインストール法が紹介されたので早速取り組んだ。サムネイルをクリックすると大きな写真になり、その右上近くにカーソルを近づけると「NEXT」の文字が現れ、左上には「PREV]が現れる。どうやら上手く機能しているようである。表現の文字などはもう少し調査してみたい。クリックすると大きな写真になります。クリックすると大きな写真になります。クリックすると大きな写真になります。クリックすると大きな写真になります。










続きを読む "隠居の庭:ヤブカンゾウ by Litebox-1.0.js"

2006年5月19日

ビオラ・パンジー

画像をクリックすると大きくなります画像をクリックすると大きくなります画像をクリックすると大きくなります画像をクリックすると大きくなります画像をクリックすると大きくなります画像をクリックすると大きくなります

 5月の庭は賑やかである。とくにビオラ・パンジー類は様々な彩りで咲き誇る。そんな中で白いジャスミンが際だっている。

 

2006年5月14日

<s>オナガアゲハ</s>クロアゲハ

クリックすると画面が大きくなりますクリックすると画面が大きくなります 昨日のゴルフは強い雨だったのに今日は風が強いものの良い天気である。めったに現れない黒い蝶が玄関の寄せ植えに飛来し、あまり離れようとしない。NikonD70で連写した。カメラをPCにUSB接続して整理しながら名前を調査した。本の積ん読が好きだった親父が残していた1966年4月発行の「標準原色図鑑全集1:蝶・蛾」(古本屋に持って行ったが昔の本は写真の質が悪いと言うことで相手にもされなかった。捨てないで良かった。)とGoogle(インターネットという巨大な百科事典があるから本はいらないのだが。)とで探してみたら、どうやらオナガアゲハらしい。間違っていたらご指摘ください。追記を見てください。指摘を受け訂正しました。)ついでに、前に撮った蝶の名前を確認してみるとどうやらキアゲハは間違いで単なるアゲハのようである。

続きを読む "<s>オナガアゲハ</s>クロアゲハ"

2006年5月10日

lightbox

 現在、lightboxが不調です。回復までしばらくお待ちください。Version2.02へのupgradeで行き詰まっています。テスト・サイトでうまく動いたものが、本番で上手くいきません。
(追記:2006/5/11) 結局、Vresion2.02での修復方法が分からず、Vresion1.0正式には、Versionは表示されていない。lightbox.jsとあるだけだ。)に戻した。ただ、前まで使っていたのに比べると写真にキャプションが入れられるようになっていたりして進化している。Version2.02はまだβ版のようなので普及するまで待つことにする。Pioneerになることはやめにした。

2006年5月 7日

久しぶりに木の香

ルーバ パソコンの前ばかりでは体に悪いし陽気も良くなってきたこともあって、久しぶりにDIYをした。といってもたいした作品ではない。昨年ウッドデッキの上に立てたパーゴラの一部にルーバ風の目隠しを作った。パーゴラを立てたときは大きく葉をつけて茂っていたデュランタが目隠しになってルーバはいらないと思っていたが、この冬の寒さのせいか家内が枝を切りつめたのが原因かで枯れ木になってしまった。そばに植わっているライラックも春に僅かの花を付けるが古木のため枯れ木寸前である。みっともないので上部に付けたと同じような手作りルーバをとりつけた。
 2X4材の端材を相欠きはぎで接いで(縦にこのような接ぎ方良くないが)斜めに1X4材用の切り込みを入れた。この切り込みは、はじめ昨年同様のものを作ったとき置いてあったテンプレートを使ってトリマーでとりかかったが、トリマーの馬力が弱く音ばかり大きくて作業が捗らなかったので、ルータをフリーハンドで使った。ルータはトリマーより馬力があるので慎重に作業すればかなり上手くいくことが分かった。取り付ける前に、最近アメリカで健康上に問題があるとか言われているキシラデコールに代わる木材保護用の塗装をし、インパクトドライバーでコースレッド止めした。2X4材の継ぎ目部分がかっこよくないので、またの機会に何かで目隠しを考えている。久しぶりの木の香でDIYへの時間が増えそうな気がする。

2006年5月 5日

ユリオプスデイジーに<del>キアゲハ</del>アゲハ

050606_2s.jpg 爽やかな陽気のせいかアゲハが庭の花にときどき飛来するようになった。動きの速い蝶を撮るのはなかなか難しい。NikonD70にTamron28-300mmをつけデジタルイメージプログラムをスポーツに設定してチャンスを待っていた。ホームセンターなどの買い物から帰るとユリオプスデイジー(なんだかこの花は年中咲いているような気がする)に飛んできたので、夢中で連写のシャッターを押した。1・2秒も経たないうちにどこかに飛んでいってしまったが、10枚ほどの写真の中で2枚ほどましな写像があった。

続きを読む "ユリオプスデイジーに<del>キアゲハ</del>アゲハ"

写真の補正

 ML仲間の一人が、旅行で撮ってきたデジカメ写真をUPしてくれた。快晴の中央アルプスを堪能したようである。写真はそのうちの1枚 小河内岳 東岳 荒川岳 赤石岳 を撮ったものだ。ただ、写真には少し不満らしく、次のような質問を同じML仲間の写真の先生にしていた。
「駒ヶ根(4/17)の天気は良かったんですが、雪山、遠景の山が上手く取れません。 こつは、何でしょうか?」 >> yamamokoさん

   yamamokoさんの答え:

雪山の写真、旨く取れていると思いますよ。かすんでいるように見えるのは、仕方のないことです。クリアに撮ろうとするには偏光フィルターを使います。でも、後処理でコントラストを高くするとより鮮やかになりますので、そのほうが手軽かもしれません。

 とあったので、早速Photoshopで実験した。一番左がオリジナルの写真。2番目がPhotoshopLEで自動補正したもの。3番目は、コントラストを+30にしたもの。+30以上にすると空との境界がなくなる。一番右はFireWorksの自動補正。PhotoshopLEとほとんど変わらない。ほんとに手軽でした。
オリジナル自動補正コントラスト増FireWorks

庭に咲く春の花(2)<small>2006</small>

mokkouki.jpgmokkousiro.jpgjasmin.jpgkodemari.jpgwasurenagusa.jpg

 気温が上昇するにつれて、庭の花も賑やかになってきた。垣根の黄色の木香バラは満開になった。いつもゴールデンウィークの頃である。白の木香バラは少し開花が遅い。エクステリア・デザイナーの意図は黄色のバラに挟まれて白が咲くということであったと思うが、白の替わりに白い斑点が入った緑になっている。家内の話では、黄色のジャスミンは鉢植えのものを地面におろしたとのもののことである。同じく垣根の昨年綺麗に咲いていたハーデンベルギアは、今年の冬寒かったせいか元気がない。コデマリが白い花をたわわに付けている。ワスレナグサは群生するもののようだが、日陰に一輪ポツンと咲いていた。

2006年5月 4日

浅香山浄水場のつつじ

浅香山浄水場 好天に誘われて、一度行きたいと思っていた、大阪府のみどり百選にも選ばれている堺市浅香山浄水場のつつじ通り抜けに行ってきた。駐車場はないとのことで栂・美木多駅までマウンテンバイクで登り(家内は電動自転車)、南海高野線の浅香山駅から10分ほど歩いた。通り抜けということにはなっているが、場内で弁当を食べることはできるらしい。サンドイッチ・缶ビール持参する。場内に入るとBBQをしている人たちも2組あった。高い市税と給与をとっている引け目があるせいか、どうも大目に見ているらしい。

ひらどつつじ 浅香山浄水場は大阪でもっとも汚い川といわれた大和川の下流沿いにある。昭和53年頃まではこの大和川から取水していたようだが、現在は大阪府営水道(ということは琵琶湖から)から受水して堺市内へ配水する場所の一つになっているようだ。
場内の約2300本の平戸ツツジは、今年は開花が遅いようで5日までの予定だった通り抜けが7日まで延期になっている。ということでまだ満開ではなかった。花の背が高いのは木が大きいこともあるが、植えられている場所が斜面になっており木の間隔が狭いせいとも思える。すべてが咲きそろったときはさぞかし豪勢になるだろう。来年はそういう日にちに来たいと思う。その日が平日であることを願っている。
泉北近辺私的観光地図に掲載

2006年4月23日

庭に咲く春の花(<small>2006</small>)

ライラック実生のヤブツバキシダレウメの実ポピーラッパ水仙モッコウバラ
 我が家の庭にも春の花が咲き始めた。今にも枯れそうな古いライラックに花がついた。家内が実から育てたヤブツバキが散水栓の側に花を咲かせた。昨年庭を改造したときに、枝を間引きしてもらった枝垂れ梅に今年は沢山の実がついている。沢山の梅酒が造れるかもしれない。家裏の苗床みたいな花壇に、ポピーとラッパ水仙が可憐な花を咲かせてる。ハンギングのパンジーやシクラメンも華やかだが、わずかな土に咲く花もすてがたい。まもなく垣根の木香バラが花を咲かせる。

2006年4月17日

堺自然ふれあいの森

コバノミツバツツジカエルカスミザクラ

 新しいもの好きの家内が「泉北コミュニティ」というコミュニティ情報誌で見つけたこの4月2日に開設さればかりの「堺自然ふれあいの森にでかけた。 驚くほどの市民税を徴収されているので、ちょっとはましなことに使っているんかいなという気持ちで付き合うことにした。家内が弁当まで用意していてくれたり、PCの前で1日中というのも体に良くないと思っていたのでカメラ片手に出かけることにした。
 このような文化的事業(?)にはあまり予算がないのか案内標識もなく泉北ニュータウンのすぐ近くなのに場所がよく分からない。家内がコミュニティ情報誌で得た覚束ない案内を頼りに(最近できたところなのでカーナビに登録されていない)ニュータウンの南はずれを探してみると堺公園墓地のはずれに看板を見つけた。
 公園墓地の道路から小さな川をわたる橋の先からは地道で、駐車場は土の地面に縄を張っただけのものである。もう一つの小川の橋を歩いて渡ったところに、案内所・事務所・休憩所を兼ねた「森の館」という鉄筋の建物がある。つくりは鉄筋だが外壁とか内装はそれらしくWoodyに仕上げている。館内の展示を見ているとボランティアの人かそれとも館員が近寄ってきて説明をしてくれた。1時間くらいの散策コースがあるというので、天気もいいし用意した弁当を持って歩くことにした。
 昨日の雨で遊歩道は少しぬかるんでいたが、久しぶりに吸う里山の空気が気持ちいい。ちょっとした昇り下りをたどっていく道すがらには、いわゆるヤマツツジ(正式名:コバノミツバツツジ)があちらこちらに咲いていた(F)。 少し広く平たくなった道の端にビニールのゴミ袋をお尻にしいて、春の日差しを浴びながら家内が急遽間に合わせに作った弁当を広げた。
 みはらし広場にでる少し手前の小さな池のそばで冬眠から覚めたばかりなのかじっとして動かないかなりの大きさの名前が分からないカエルに家内が声を上げた。枯れ葉の色ににているので、よく観察していないと見分けがつかない(K)
 見晴台から引き返す尾根道沿いに珍しい桜(カスミザクラ)が、文字通り青空を背景にかすみのように咲いていた(T)
 散策している間中、ウグイスの鳴き声が透き通っていた。録音のできるMP3プレイヤー NomadⅡを持っていたが、録音レベルが低くまた独特のファイル形式でブログに収録するには難しかった。良いレコーダーが欲しいなー![追記:]レコーダーを手に入れました。
 日曜日、ようやく好天になったのに、出会ったのは小さい子供連れ夫婦と我々と同じような熟年夫婦2組であった。泉北ニュータウンも今や泉北オールディーズになってきた。人出はこれぐらいがいい。
 帰途、30年くらい前に堺市が公募したときに手に入れていた我が家の墓地(まだ石を巻いただけの更地ですが)を探すとなんとこの「ふれあいの森」入り口の反対側から続く桜並木の花吹雪のすぐさきにあった。だんだんと墓に近づいてきたんかなーと家内と苦笑した。

続きを読む "堺自然ふれあいの森"

2006年4月 7日

カナメモチ:Redrobin

クリックすると画面が大きくなります  お向かいの垣根のこの地方で言うアカメガシの若葉が、見事にきれい。カナメモチが正式名らしい。これを垣根にされている家はご近所にも多いが、お向かいは昨秋きちんと刈り込みをされたせいか一面に赤い若葉が生えそろっている。よく手入れをされた庭を見ていると心が和む。




続きを読む "カナメモチ:Redrobin"

2006年4月 4日

ペンキ塗り

クリックすると大きくなります 桜が咲くようになって、ようやく戸外活動を開始した。昨年夏、プロに頼んで門扉とガレージをリフォームした。その際、30年前の新築時に設けた隣家との境界になっているガレージなどのブロック塀にモルタルを塗ってもらった。古いブロック塀の上に塗ったので、想定されていたことであるが1ヶ月もしないうちに何ヶ所かクラックができた。このクラックは樹脂モルタルで埋めたが、色が異なるので傷跡で残った。


クリックすると大きくなります それで、リフォーム当初から予定をしていたペンキ塗りを天気予報をにらみながら実行することにした。小さな作品には、ペンキを塗ったことはあるが、15平米もの大きな所に塗るのは初めてである。DIYの雑誌を参考に、あまり派手ではないサンドベージュという色の水性凹凸塗料を塗ることにした。ペンキがあちらこちらに付かないように、養生テープをしっかり貼った。これが結構面倒な仕事である。広い面は、凹凸塗料専用のローラバケで塗った。これが簡単そうでなかなか難しい。塗り上がりは写真のようになるのであるが、このように塗るコツをつかんだのは、ほぼ塗りおえる頃であった。でも全体を見渡すと塗りむらがあり、やっぱり素人細工である。防水が目的であるから、まあ良しとしなければならないと思っている。クリックすると大きくなります2時頃塗りおえたが、夕方から雨になった。どのような効果が出ているか、明日の楽しみにしている。





続きを読む "ペンキ塗り"

3~4分咲き:4月4日


 ニュータウン(政令指定都市堺市南区)の桜も見頃になってきた。天気がコロコロと変わるが、雨の止み間を縫って写真を撮りに出かけた。泉北に住まいして31年になるが、住み始めた頃の苗木が大きく成長している。結構、いい町になった。
 明日天気が良ければ、光明池方面での桜を探索してみることにするつもりである。

続きを読む "3~4分咲き:4月4日"

2006年3月21日

蕾固し

西原公園のソメイヨシノ(2006/3/20)
アイコンをクリックすると写真がでます。

 犬の散歩ではなく、孫の散歩がてら、泉北ニュータウンで一番のさくら名所、西原公園にいきました。天気予報では、大阪の開花は例年より早く間もなくとのことですが、まだ蕾は固いようです。毎年の開花を観測する木を決めておかないといけませんね。
 WBCで日本が優勝したようです。アメリカの選手やファンはどんな思いなんでしょう。

2006年3月20日

ハナカンザシ

写真をクリックすると画面が大きくなります。 高知あたりからの開花便りが聞かれるようになって、我が家の庭もようやく花が咲きだした。シダレウメもほぼ満開になった。家内が、ガーデニィング教室で作ったドーナツ型の花輪のハナカンザシが鮮やかになった。
 PCの前から離れて、戸外活動を始めようと思ってるが、少しHPを弄るのにつれて次から次へと問題が発生する。アルツハイマー的ミスが多いのだが、まあボケ防止にと自らを慰めている。

2006年3月12日

LightBox test3

DSC_0007.JPG  ライラックの花芽がついている。紫の花が待ち遠しいです。
このエントリーは、lightbox JSの実験も兼ねている。我楽さんのコメントに従って、/cgi/mt/lib/MT/App/CMS.pm ファイルの一部を弄って、画像のアップロードを容易にするようにした。手入力がなくなり楽である。
でも、この世界のみなさんは好きなニックネームを付けておられますね。
(追記:2007/9/30)現在、この修正は行っていない。lightbox のグループ化に伴い、画像のアップロードをするときに埋め込みコードに文字を入力せざるを得ないからである。泥臭い方法であるが、FEPに単語登録しておくことで補っている。

2006年3月11日

今年の白滝枝垂梅

クリックすると画面が大きくなります。 いつもこの梅が咲くときが待ち遠しい。歳をとるにつれてその度合いが強くなっているようである。そろそろ冬眠から覚めて、戸外活動を始める気になってきた。
  このエントリーもlightboxの実験である。個別アーカイブがどうもうまく表示できない。

続きを読む "今年の白滝枝垂梅"

2006年3月10日

隣の花は紅い

クリックすると画面が大きくなります。 ほとんど留守にされてるお隣の梅の木に昨秋、毛虫が沢山付き、糞が我が家のガレージに落ちてくるので、植木の刈り込みをされたときに、お願いして短く切ってもらった。そのせいか、今年の花は、綺麗な紅い花がついた。「梅切らぬ阿呆に、桜切る馬鹿」とかなんとかありましたね。

 ところで、このエントリでは「小粋空間」で紹介されているLightboxというカスタマイズの実験をしている。これはサムネイル画像をクリックすると元の画面が背景にフェードアウトし、クリックした画像が元の大きさで画面真ん中に表示されるというお洒落なカスタマイズである。しかし、タイトル・バナーや右サイドバーのFlashは、背景ではなく表面に出てくる。色々と隠す方法を探しても見つからないが、同じ現象についてのコメントがあったので、私だけの現象ではないようだ。もう少し、調査してみようと思っている。

 なお、Lightbox原作者へのリンクが、急に切れてしまった。リンクが復活すれば3月11日朝復活しました。何か手当が見つかるかもしれない。

 今日は朝から雨模様。また、PCの前で、1日過ごしそうである。

続きを読む "隣の花は紅い"