« HTML<TABLE cellpadding  cellspacing> | トップページ | LINE »

2009年5月13日 (水)

hoverhover

といえばbonobosのメジャー1作目ですが、本日はcssのhoverのお話。
本日は旅行代理店さまのサイト更新管理に半日とちょい。
残りは昨日の続き。

inputにhover効果を適用するのにあれやこれや。
DREAMWEAVERで下記のように作成。簡単。

<input type="image" id="confirm" name="submit" value="" src="image/ka.gif" alt="確認する" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('confirm','','image/ka1.gif',1)"/>

しかしどうしてもCSSであててほしいとの要望で、

<a>
<input type="image" id="confirm" class="btnclass" name="submit" value="" src="image/co.gif" alt="確認する"/></a>

<style type="text/css">

a:hover{
background: #000;
filter: alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
width:145px;
height: 40px;
margin:0;
padding: 0;
}

</style>

となりました。我ながら邪道な気がします。。。

 Hover Hover Hover Hover
販売元:セブンアンドワイ
セブンアンドワイで詳細を確認する

|

« HTML<TABLE cellpadding  cellspacing> | トップページ | LINE »

パソコン・インターネット」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/1194467/29596457

この記事へのトラックバック一覧です: hoverhover:

« HTML<TABLE cellpadding  cellspacing> | トップページ | LINE »