マウスオーバーで画像を入れ替えるテスト | インターネットを使ってお金を稼ぐ方法

マウスオーバーで画像を入れ替えるテスト

3件のコメント

1. チカ☆ より:

   2008/2/20 水曜日 23:47:10

   スゴー！

   なんですか？これ。

   GIF？

   どうやるんでしょう！？

   ヒントがほしいです！

   詳細情報希望してもいいですかDR.！！

   　　チカ☆　ｍ(_”_)ｍ
2. KORIBA より:

   2008/2/21 木曜日 0:21:53

   ありがとうございますぅー

   ２つのGIFアニメを使ってます。
   マウスオーバーしたときに２つ目のGIFを呼び出すようにスタイルシートで設定します。

   アニメ描くのに時間かかりましたｗｗｗ

   ソースは以下です。

   —ソース—
   
   p.Reg a{
   display : block ;
   width : 130px ;
   padding-top : 77px ;
   text-align : center ;
   background-repeat : no-repeat ;
   background-position : top center ;
   }

   p.Reg a:link{
   color : blue ;
   background-image : url(../gif01-1.gif) ;
   }

   p.Reg a:visited{
   color : purple ;
   background-image : url(../gif01-1.gif) ;
   }

   p.Reg a:hover{
   color : red ;
   background-image : url(../gif01-2.gif) ;
   }

   p.Reg a:active{
   color : green ;
   background-image : url(../gif01-1.gif) ;
   }

   以下、アイコンを表示したい場所に記述。

   人気ブログランキング
   
3. KORIBA より:

   2008/2/21 木曜日 0:26:03

   あ・・・（汗
   ソース張ったらそのまま表示されちゃいました（汗

   
   ＜ｐ　ｃｌａｓｓ＝”Reg”＞＜ａ　ｆｒｅｆ＝”ｈｔｔｐ：//blog．ｗｉｔｈ２．ｎｅｔ/ｌｉｎｋ．ｐｈｐ？12345”　ｔａｒｇｅｔ＝”＿ｂｌａｎｋ”＞人気ブログランキング＜/ａ＞＜/ｐ＞

コメントはこちらから

名前

メール

URL

次のタグが利用できます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <img localsrc="" alt="">