suzrinブログ
HTML,CSS,Javascript,Nikon D5000での撮影記録あとPCパーツ大人のゲームなどなど
[PR]
×
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
スタイルシートのみでのポップアップを作るこつ
CSS（スタイルシート）のみでイージーにマウスカーソルを載せたときに
ポップアップを作るこつをメモ
<a>判定部分<span>ポップアップ内容</span></a>
まず受けるHTMLの方はこういう入れ子構造にしておく
IE6を対応から切れるなら<a>じゃ無くても可能
で、
position:absolute;
を<span>に適応して
描画の流れから取り除いたら画面外にとばすか
visiblity:hidden;で見えなくしておく
で以下が肝心の判定部分
a:hover span{}
これでオンカーソル時の内容を指定しておく
ポップアップを作るこつをメモ
<a>判定部分<span>ポップアップ内容</span></a>
まず受けるHTMLの方はこういう入れ子構造にしておく
IE6を対応から切れるなら<a>じゃ無くても可能
で、
position:absolute;
を<span>に適応して
描画の流れから取り除いたら画面外にとばすか
visiblity:hidden;で見えなくしておく
で以下が肝心の判定部分
a:hover span{}
これでオンカーソル時の内容を指定しておく
PR
この記事にコメントする
カレンダー
| 04 | 2025/05 | 06 |
| S | M | T | W | T | F | S |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | ||||
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
ブログ内検索
ツイッター
フリーエリア
１８歳未満には不適切な内容がある場合が有ります閲覧にはご注意ください。
詳しくはりーどみーをご覧くださいお願いします
blogに関する連絡はこちらまで"suzrinあっとまーくmail.goo.ne.jp"
blogに関する連絡はこちらまで"suzrinあっとまーくmail.goo.ne.jp"
カテゴリー
最新記事
(09/15)
(07/25)
(04/24)
(03/08)
(02/06)
(01/22)
(11/19)
(06/01)
(05/09)
(05/07)
最新トラックバック
カウンター
クロシェットさんの新作プリズムリコレクションからアイナちゃん！
ストレガさんの新作木洩れ陽のノスタルジーカのフロゥちゃん＼(＞ヮ＜)／
はいぺりよんさんのシストリのるなちー
フェイバリットさんの新作色とりどりのひかり！
Chuableさんの新作アステリズム 応援CHU
AXLさんの新作から月海ちゃん応援中！
Meteorさんの新作Princess-Styleから一宮菖蒲ちゃん応援中！
YUZU SOFTさんの新作とSAGAPLANETSさんの新作応援中！
loseさんの新作『ものべの』応援中！
Favoritさんの新作いろとりどりのセカイ
