2012.04.04
アンカーリンクを使って特定のIDまでスクロールさせるのは簡単に出来ますが、
この場合、リンク元で指定しなければなりません。
リンク元で指定できない場合でも、アクセス時に自動で移動する必要があり探しました。
検索では「window.scrollTo」などがよく出てきますが、
数値で指定するため移動させたい位置の上にテキストなどがあると使用できません。
なんとかCLASSやIDで指定できないか探して見つけました。
すごく簡単で使いやすいです。
下記の記事を参考にしています。
>リンク先ページの指定位置にスクロールで移動
---------------
---------------
青字部分を移動させたい位置のIDまたはCLASSを指定すれば完了です。
この場合、リンク元で指定しなければなりません。
リンク元で指定できない場合でも、アクセス時に自動で移動する必要があり探しました。
検索では「window.scrollTo」などがよく出てきますが、
数値で指定するため移動させたい位置の上にテキストなどがあると使用できません。
なんとかCLASSやIDで指定できないか探して見つけました。
すごく簡単で使いやすいです。
下記の記事を参考にしています。
>リンク先ページの指定位置にスクロールで移動
---------------
<script type="text/javascript"> $(function() { var n = window.location.href.slice(window.location.href.indexOf('?') + 4); var p = $("移動させたいIDまたはCLASS").offset().top; $('html,body').animate({ scrollTop: p }, 'slow'); return false; }); </script>
---------------
青字部分を移動させたい位置のIDまたはCLASSを指定すれば完了です。
2012.03.28
スマートフォン用のサイトでよくアドレスバーを隠す設定になっているところを多く見かけます。
ということで検索していろいろなページを参考にやってみました。
一画面で表示できる範囲がひろくなっていい感じです。
赤字部分が必須です。
---------------
---------------
1点注意点が。
このアドレスバーを隠す設定をしている場合、
idを使ったアンカーリンクがきかなくなります。
ご注意を。
ということで検索していろいろなページを参考にやってみました。
一画面で表示できる範囲がひろくなっていい感じです。
赤字部分が必須です。
---------------
<!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1"> <title>スマートフォン用サイト</title> <style type="text/css"> body { min-height: 416px; -webkit-text-size-adjust: none; } </style> <script type="text/javascript"> window.onload = function(){ setTimeout("scrollTo(0,1)", 100); } </script> </head> <body> サイトの中身 </body> </html>
---------------
1点注意点が。
このアドレスバーを隠す設定をしている場合、
idを使ったアンカーリンクがきかなくなります。
ご注意を。
2011.07.06
文章中に、アイコンなど小さな画像を入れたい場合が結構あります。
そんな時は、画像に「vertical-align:middle;」や「vertical-align:text-top;」を
指定するとほとんどのブラウザで崩れる事なく表示されます。
が、やはりIE6では、画像挿入後にline-heightが無効になってしまうらしく
かなり崩れてしまいます。
上記は1、2、3の文章をリストにしています。
下記のように、リスト内の画像にスタイルを当てると
多少のずれはあるものの、IE6でもきれいに表示されます。
----------------------
li img{
padding:6px 0 5px 0;
vertical-align:middle;
}
li > img {
padding:0;
}
----------------------
下記のページを参考にさせていただきました。
IEバグ:img要素などの置換要素を含む行の前後では、line-heightが指定した値より小さくなる
そんな時は、画像に「vertical-align:middle;」や「vertical-align:text-top;」を
指定するとほとんどのブラウザで崩れる事なく表示されます。
が、やはりIE6では、画像挿入後にline-heightが無効になってしまうらしく
かなり崩れてしまいます。
- ああああああああああああああああああああああああ
- いいいいいいいいいいい
- ううううううううううううううううううううううううううううううううううううううううううううううううううう
上記は1、2、3の文章をリストにしています。
下記のように、リスト内の画像にスタイルを当てると
多少のずれはあるものの、IE6でもきれいに表示されます。
----------------------
li img{
padding:6px 0 5px 0;
vertical-align:middle;
}
li > img {
padding:0;
}
----------------------
下記のページを参考にさせていただきました。
IEバグ:img要素などの置換要素を含む行の前後では、line-heightが指定した値より小さくなる
2010.01.27
DNSサーバー、切り替えの際に、
実際に自分の環境で切り替わっているかどうか調べる方法。
Mac OS X の場合
アプリケーション>"ネットワークユーティリティ"
というユーティリティを使用します。
Nslookup という項目を選択し、サーバー名を入力、
"Lookup"ボタンでIPアドレスが表示されます。
実際に自分の環境で切り替わっているかどうか調べる方法。
Mac OS X の場合
アプリケーション>"ネットワークユーティリティ"
というユーティリティを使用します。
Nslookup という項目を選択し、サーバー名を入力、
"Lookup"ボタンでIPアドレスが表示されます。
2009.05.26
<Files ~ "\.(dat|log|csv)$">
deny from all
</Files>
※.htaccessで表示させたくないファイルの拡張子を指定。
dat|log|csv
を入れる。
ブラウザ越し(http://)に表示ができない。
大切なデータの流出を防く。
deny from all
</Files>
※.htaccessで表示させたくないファイルの拡張子を指定。
dat|log|csv
を入れる。
ブラウザ越し(http://)に表示ができない。
大切なデータの流出を防く。