IE7/IE8で背景透過が効かない場合

通常の↓↓では効かないので、

	filter:alpha(opacity=70);

こっちですると大丈夫みたいです。

        background-color:rgba(0, 0, 0, 0.5);
        filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7f000000,endcolorstr=#7f000000,gradienttype=0);
        -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000,endColorstr=#7f000000)";
        zoom:1;

うーんオーバーレイではまった。

css

まだ使って無いけどメモ

jquery教本に載ってたんですが
ネットに絶対導入方法あるだろうから買うのを渋ってしまう…

背景全面に動画を流すJqueryプラグイン【tubular】
http://code.google.com/p/jquery-tubular/downloads/list

パララックスオススメJqueryプラグイン【jarallax】
http://liginc.co.jp/web/js/jquery/24446

EC-CUBE viewport拡大許可でipadがずれたときの対処方法

スマホでPCサイトを見るという特殊なカスタマイズを加えていたので、
ipadで見るとviewportが邪魔をして拡大率がすさまじいレイアウト崩れが発生していた修正

とりあえず phpでipadかの判定を行い、ipadの場合はviewportを出力しないで一気に解決b
widthも1024pxかレイアウトの最大幅にあわせることで直りました。

ふー、よかったよかった。

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {
	#container {width:1024px;}
	}

<!--{php}-->
$isiPhone = (bool) strpos($_SERVER['HTTP_USER_AGENT'],'iPhone');
$isiPad = (bool) strpos($_SERVER['HTTP_USER_AGENT'],'iPad');
if($isiPad){
    echo "";
}else{
    echo "<meta name=viewport content=width=device-width, initial-scale=0, maximum-scale=1, user-scalable=1 />";
}
<!--{/php}-->

スマホ メニューのスクロール慣性に対応したドロワーメニュー【spslidemenu】

正式名称をようやく知りました。ドロワーメニューっていうですねアレ。

sidrを入れていたのですが、iphoneのchromeとandroid標準ブラウザ(仕様的)で不具合頻発だったので
探しに探しまくりいろいろ検証した(約3時間ほど)結果、

be-hase.comさんの【Spslidemenu】が操作性・安定性ともに一番使いやすいかと思います。
http://be-hase.com/javascript/428/

※ただやはり「android標準ブラウザ」は強敵で、demoにあります「No Header」はメニューが開かず延々更新されるという罠。
(はじめてandoroidがにくいと思った瞬間)
まさしく↓ですね。4時間ほど格闘しました。

Android端末におけるオーバーレイ表示時の困った現象の報告と、その対処法について
http://blog.bluearrowslab.com/smartphone/topicks/237/

とりあえずなんちゃって対処方法はまた今度。。。覚えてたら書こう。。。

[CSS]:notのメモ

具体的な使い方は今度調べてみようー
参考:http://weboook.blog22.fc2.com/blog-entry-382.html

#header li:not(.class) a:hover{処理}

これで、ヘッダ要素 のli.class以外のa要素ホバーの指定ができます。
たぶんあんまり使い道はないですが、ちょうど私は必要だったんで大助かりですー。

XPサポート終了にともなって、CSS3は気兼ねなく使えるようになるかな
IE7問題がありますが。。。。

css

[Jquery]fadeToでリンクホバーでフェードイン・フェードアウトのサンプル アニメーション完了まで待機も

$(document).ready(function(){
    $("#aaa a").hover(function(){
       $(this).fadeTo("normal", 0.5);
    },function(){
       $(this).fadeTo("normal", 1.0);
    });
});

単純にこれだけでもよいのですが、
お客さん(かなりjquery詳しい人)からキュー残るのが気になるというので下記を設定(^ ^)

$(document).ready(function(){
   $("#aaa a").hover(function(){
       $(this).stop(true).fadeTo("normal", 0.5);
    },function(){
       $(this).fadeTo("normal", 1.0);
   });
});

これ追加するだけの簡単なお仕事です。(最初から設定しとけというお話)

.stop(true)

[Jquery]BXSLIDERのonSlideBeforeで背景色切り替え

うーんすばらしい!
ここまでオプション用意してくれてるとかなり使いやすいですね

$(function(){
  bg = 0;
  var slider = $('.bxslider').bxSlider({
  onSlideBefore: function(){
  	if(bg == 0) {
  		$('#aaa').css("background-color","#fff");
		bg = 1;
  	}else {
  		$('#aaa').css("background-color","#000");
		bg = 0;
  	}
  }
  });
});

もっとスマートな書き方あるかな?