何か実行ボタンやリンクを押下した際、
"ただいま処理中です。しばらくお待ちください..."
という文字を表示したいケースがあるかと思います。
以下のアドレスにて良い説明がされていましたので
アドレスだけ書いておきます。
http://www.ezms.net/guide/dev/js_study_20051103_001.html#source
2011年4月7日木曜日
2011年4月4日月曜日
css、↑ページトップへ戻る の機能について
<meta http-equiv="X-UA-Compatible" content="IE=8">
の設定をhtmlに施し
<A href="#container">↑ページトップへ戻る</A>
のリンクを設定した場合、なぜか完全にhtmlの一番上まで飛んでくれず
ミリ上部のスクロールが発生する経験はないでしょうか、
今回、この問題への対応方法がわかったので書いておきます。
１．bodyタグの余白を消す。cssを作成
以下の通りです。
body {
margin: 0;
padding: 0;
}
２．body直下に全体を括るcontainerのcssを作成。
その時、適宜、padding側を調整して余白を作成。
以下の通りです。
#container {
margin: 0;
padding: 6px;
}
３．html側の記述例は以下の通り
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<link rel="stylesheet" type="text/css" href="./menu.css">
</head>
<body>
<!-- container --->
<div id="container">
<div class="footer">
<A href="#container">↑ページトップへ戻る</A>
</div>
</div>
</div>
</body>
</html>
これで綺麗にページトップへ戻ってくれます。
の設定をhtmlに施し
<A href="#container">↑ページトップへ戻る</A>
のリンクを設定した場合、なぜか完全にhtmlの一番上まで飛んでくれず
ミリ上部のスクロールが発生する経験はないでしょうか、
今回、この問題への対応方法がわかったので書いておきます。
１．bodyタグの余白を消す。cssを作成
以下の通りです。
body {
margin: 0;
padding: 0;
}
２．body直下に全体を括るcontainerのcssを作成。
その時、適宜、padding側を調整して余白を作成。
以下の通りです。
#container {
margin: 0;
padding: 6px;
}
３．html側の記述例は以下の通り
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=8">
<link rel="stylesheet" type="text/css" href="./menu.css">
</head>
<body>
<!-- container --->
<div id="container">
<div class="footer">
<A href="#container">↑ページトップへ戻る</A>
</div>
</div>
</div>
</body>
</html>
これで綺麗にページトップへ戻ってくれます。
2011年4月2日土曜日
登録:
投稿 (Atom)