押すとズレる、ボタンの作り方（スイッチのようなボタンの作り方）

質問

http://comfy.qp.land.to/sample/web_03/

↑
このサイトの、「資料請求はこちらから」、「アクセスアップ」のような、
ボタンを作りたいと思っています。

ボタンデザインをこの通りにしたいのではなく、
ボタンの上にカーソルを乗せると、スイッチのようにボタンをずらす方法を知りたいです。

誰か教えていただけませんでしょうか？よろしくお願い致します。

※グラフィックソフトは、illustratorCSとphotoshopCSです。
ホームページ作成ソフトは、Dreawweaver8。
パソコンは、WindowsXPを使用しております。

回答No.3

awasumi · ベストアンサー

/* マウスカーソルが上に来た時のリンク */
a:hover {
position : relative;
top: 1px; /* 下に動く大きさ */
left: 1px; /* 右に動く大きさ */
}

数値を変えると動く位置も変わってきます。

一部分だけずらしたいのであれば、これ↑をクラス指定してやればできますよ～。

お礼

ご回答有難う御座いました。記載していただいた項目を、クラス指定したら、ボタンが思うようにズレてくれました！本当に有難う御座います！！

回答No.2

12m24

マウスが画像の上にきたときに画像を別のものにするって言う手もあります。

お礼

ご回答有難う御座いました。マウスを別の画像にしてみたのですが、うまくいきませんでした。私のやり方が間違っていたのですね。もう一度試してみます。有難う御座いました。

回答No.1

ao777

おそらくJavaScriptを使っていると思われます。
ボタンコントロールはほとんどがJavaScriptですので、
検索かけて勉強して下さい。

お礼

ご回答有難うございました。Javascriptを調べるという手がありましたね!盲点でした。教えていただいて、有難う御座いました。