スマホサイトで縦持ちと横持ちを判別。

CSSの切り替えなどで縦持ち横持ちを判別して、何かしら動作させるためのjqueryの方法。

 switchOrientation();
 window.onorientationchange = switchOrientation; 
function switchOrientation(){
var orientation = window.orientation;
if(orientation == 0){

}else{

}
//やり直しさせたい関数();
}

参考にさせていただいたサイト。
http://blog.webcreativepark.net/2010/08/17-200704.html
あえて関数名などそのままです。ありがとうございました。

Androidで確認するとテキスト幅が狭くなっている件

こちら、それなりに新しいVersionのAndroidでも起こりうる現象のようで。

基本的にpタグを使用しなければ避けられるようですが、それって本末転倒。
hタグでも起こりました。

簡単な回避法は
・背景色を指定
・背景に透明pngなどを指定

のようです。
無駄な画像を入れたくないけど、背景色入れられないパターンもあるから悩ましい。

グロナビにセカンダリメニューというか子要素のナビをつけるときに使えたやり方

よくあるコーディングとして

<ul>
<li class="nav01"><span>親カテゴリ</span>
<ul>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
</ul>
</li>
<li class="nav02"><span>親カテゴリー</span>
<ul>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
</ul>
</li>
<li class="nav03"><a>そのままリンク</a></li>
</ul>

よくある。
jqueryとかでliにhoverしたら、その子要素を・・・
でも今回は直接リンクだったり、ただの親要素だったり。
そこでliの子要素が何なのかを見て、実行処理を分ける。

$(“#gNav > ul > li:has(span)”).hover(/////

なんとなくやりやすかったから備忘録。

google Chromeでローカルのhtmlをチェックしようとするとずっとグルグルする件

基本的にChromeの要素をチェックが使いやすいのでローカルチェックはChromeを使用しているのだが、たまーにいつまでも表示されなかったり、すんごい時間がかかることがある。

今まで原因分からなかったのだけど、ggった結果判明。

参考にさせていただいたサイト様:http://eien.seesaa.net/article/302127165.html

正直読んでもあんまり分からないのだけども、Chromeの脆弱性対策らしいです。

src=”//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

こういうのね。

ローカルであってもWebサーバー経由でのアクセスであればいいらしい。「file:スキーマ」だと公開を意図していないファイルを盗まれるなどの恐れがあるからだろうか?

とのことです。httpから書けば動くってことかと。