リンクしている画像に影を付ける
実物
画像に影を付け、なおかつ、カーソルover時にフレームの色を変更するようにしてみた。
神流湖バス通信の死魚祭@2007の「内容」にある写真2枚で試して頂きたい。
解説
まず、アップロードした画像に影をつけるにはを行う。
今回、当サイト向けに変更した内容を紹介。
html
Lightbox Plusでリンクしている画像(0103a.jpg)をp要素でマークアップする。p要素はphotoクラスとした。
<p class="photo">
<a href="../image/2007/0103aL.jpg" rel="lightbox">
<img src="../image/2007/0103a.jpg" alt="死魚祭豪華賞品。" width="192" height="144"/>
</a>
</p>
css
p.photo
{
float: right;
background: url(../image/shadowAlpha.png) no-repeat bottom right !important;
background: url(../image/shadow.gif) no-repeat bottom right;
margin: 10px 5px 10px 15px !important;
margin: 10px 5px 10px 10px;
}p.photo img
{
display: block;
position: relative;
background-color: #fff;
border: 1px solid #a9a9a9;
margin: -5px 5px 5px -5px;
padding: 5px;
}
nlog(n)さんところを参考にCSSを記載。
cssカーソルover分
p要素およびimg要素両方に背景色を指定すると、写真のフレームの部分の色が変更されます。
p.photo a:hover,
p.photo a:active
{
background-color: #fcc;
}p.photo a:hover img,
p.photo a:active img
{
background-color: #fcc;
border: 1px solid #ffa9a9;
}
手こずった点は、img要素のみの宣言だとIE6では不完全となりました。
p要素も宣言する事でIE6でも大丈夫でした。
あと、doctype宣言で互換モードの場合は試しておりません。
特に問題が出なければこのまま使おうと思います。
ハイパーリンク画像に影を付けてみる
あけましておめでとうございます(遅)。今年も頑張ります。
lightbox+を試してみた
Lightbox Plusより、
神流湖バス通信でlightbox+を使ってみた。
サムネールをクリックすると同一ウィンドウ上に画像を表示するというLightbox JSの拡張版。
果たしてうちのサイトはクールに見えるのだろうか?
ちなみに、
[神]ルアープレゼント企画-神流湖バス通信なんてものをやってます。
23日までにクイズに答えるとバス用のルアー3つをプレゼント致します。
気軽にご応募ください。
バージョン管理をCVSで行う
CVSでバージョン管理を行うように設定したので、そのメモ。
参照先はMac OS X : Software Install Memoから、
実際の手順
1. ~/.bash_profileにexport CVSROOT=$HOME/CVSROOT
を追加してパスを設定する
$ mkdir ~/cvsroot
$ cvs init
3. リポジトリにプロジェクトを登録する(モジュールを作成する)
実際のプロジェクトをphp_testという名前で登録する。
$ cd ~/projectName
$ cvs import -m "Project since 2006" php_test hoge first
4. システム環境設定の「共有」からリモートログインを開始する
とのことで、同様に実施。但し、MacOSX で Eclipse から localhost の CVS を使う場合は工夫が必要。なぜか pserver では使えない。extssh を設定する必要あり。
Connection type: extssh
User: hoge
Host: localhost
Repository path: /Users/hoge/cvsroot
Save passwordにチェック。
5. Eclipseを起動して共有してソースを取得
CVSの使い方を覚えていかないと。
XdebugをOSXにインストールしようとしたが
外部のPHPインタプリタが選択できるようになったので、
PHPにXdebugを追加しようと思った。
Do You PHP? - Xdebugを導入してみる - JavaのStackTraceが欲しい!を参考に行ってみたのだが、アパッチが起動するときエラーになってしまい断念。
一応行った事をメモしておく。
1.アップルのCDからXcodeをインストール
2.PECL :: Package :: Xdebugからxdebug-2.0.0RC1.tgz (246.4kB)をダウンロード
3.Xdebugのソースをコンパイル。道中re2cがないと怒られたので急遽こちらを先にコンパイルした
4.makeしてインストール
5.apache再起動
しかし、
/usr/sbin/apachectl: line 193: 2466 Trace/BPT trap $HTTPDとなり起動できない。
/usr/sbin/apachectl start: httpd could not be started