COLUMN > GENERAL

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



LINEで送る
PREV : 東京ガスの検針の人はどこから現れ、どこに消えるのか?
NEXT : spモードでHTMLメールで埋め込みリンクOK

ウィニング競馬は植田萌子アナでOK


土曜日にやってる競馬中継番組、テレビ東京のウィニング競馬の司会が井森美幸と須黒清華アナから、植田萌子アナウンサーとどこから沸いてきたのかジャングルポケット斉藤慎二に変わったが、いきなり司会変更にな...つづきはこちら