bxsliderのCSSに注意
bxsliderはタグにCSSをインライン記載するが、ul class="bxslider" のところにインラインさせるCSSに書き込まれる「translate3d」が原因で、Android純正ブラウザにおいてそれ以降どこかでrotateを使っていたりするとそのrotateが効かなくなることがある。
transform:translate3dを使うとそれ以降rotateが効かなくなるというのはネットで見つけたが、私が遭遇したケースではrotateが効かなくなるというのはtransform:translate3d直後からというわけでもなかった。ソース上の位置とか、css上の位置とかなんかもう1つ要因がある様に思う。
とりあえずアンドロイドでtransform:rotateが効かないところがある、そういえばbxsliderも使っているという場合は以下の様にbxsliderのjsファイルの中でtransform:translate3dを書き出している部分を修正する必要がある。
//var propValue = slider.settings.mode == 'vertical' ? 'translate3d(0, ' + value + 'px, 0)' : 'translate3d(' + value + 'px, 0, 0)';
var propValue = slider.settings.mode == 'vertical' ? 'translateY( ' + value + 'px) ' : 'translateX(' + value + 'px)';
あとオマケだが、bxsliderのオプションでmode: 'fade'を指定すると、Android2.3系標準ブラウザでダメ。
jQuery Content Slider | Responsive jQuery Slider | bxSlider
NEXT : spモードでHTMLメールで埋め込みリンクOK