bxsliderがIEで動かないときのチェックポイント。

うさうさんの自分用覚え書きもかねてます。。。
パソコンだけでなく、スマホでも動いて、
IEもOKのハズ…なjQueryスライダー
bxslider.com ※外部サイト
なんですが、safari(Mac/iPad/iPhone)、Firefox(Mac/Win)、Chrome(Mac/Win)OKときて、、、
例によって
IEでうごかねーーーーーー
ってあたりで、悩んでますた。
もうね、この件で、何度IE爆発しろって思ったか。
(正直IE6もあれだけど、、、9ですら…(´・ω・`))
うさうさん的には、Windowsユーザーの皆様も、
FireFoxまたはChrome推奨です。
最近印刷物の仕事ばっかりで、WebとかCSSとか
あんまりやってなかっただけに余計キツかったw
さてさて、本題。
うさうさんは、基本的に、上の大元のリンクと
このサイトを参考に、作っていて、
SUPER CHEMICAL:
jQuery 簡単かつ高性能なスライダー【bxslider】の設置
– Divスライド系の中では一番のオススメです。

とりあえず、動かないときの対処法として、


1 

$(document).ready(function(){

jQuery(document).ready(function($){

に変えてみる


2 オプションの最後のカンマはかならず取る。

speed: 7000,
pause: 5000,
controls: false,
auto: true,
pager: false

参考サイト
雑草空間:
jQuery が IE でうごかねぇーーー、って思ったので、メモっとく。


それでも、うごかなかったわけですが、、、
コレで動きました(爆)
3 IDとかclass名を間違えない(爆)(爆)(爆)
マジでバカみたいですが、これですた。
しかもIE以外はなんか動いちゃったからたちが悪い。
なんかわかんないけど、htmlのところのスライダー適用分の、
divをね、

div class="bx"
※半角の<>がつくんだけどpreとかcodeのタグを入れてもアメブロでは無視されるっぽいので、省いてます。

って書いちゃってたのよ。
コレでもsafariとか、Firefoxでは動いちゃうからわかんなかった。

div class="bxslider"

にしたら、普通に動いたってばよ(´・ω・`)
そもそもね、1ページにコールの部分で、

jQuery(document).ready(function($){
$('#slider1').bxSlider({

って書いてて、スライドさせたい画像を<div id=”slider1″>では囲ってるから、
全然気に止めてなかった。
正直、いるのかどうかわからんけど
div id=”slider1を囲っていた、div class=”bx”をdiv class=”bxslider”に変えたら動きますた。
本当にこれが原因なのかわかんないのだけど、
原稿が出るのが遅かったのもあって、半月悪戦苦闘して
(これだけやってたわけじゃなくて、中途半端な時間を利用して戦ってたんだけどw)、
なんかこれを変えたらOKだったのでメモ。


◆後日談◆
その後、どの段階でコピーしたかわかんない同じ構成の別ページも
うごいてなーーーーいってことに気づいたんだけど、
もしかして、ヘッダー部分の呼び出し部分が原因って可能性もなきにしもあらず。。。(爆)
ただね、何がイヤって、そのヘッダーだのクラスだの直す前から
safari、firefox、ChromeではMac同様に、WindowsでもIE以外は動いてるわけよ(;´Д`)

<script type="text/javascript" src="./lib/jquery.bxslider.js" charset="utf-8"></script>
※半角の<>とかがつくんだけどpreとかcodeのタグを入れてもアメブロでは無視されてエラーがでるっぽいので所々全角になってます。

かしらんね。もうわかんね。
動いたからいいってことにしてる。


◆後日談の後日談◆
もうね、テキトーすぎて恥ずかし過ぎるこの記事に毎日結構沢山の人が来て頂いて、恐縮するばかりです。
(消そうか悩むレベルで。結局何が原因だったのか核心をもっていえてないしw)
他の要素としては、jQueryのバージョンでひっかかっていたりとかするみたいですよ。
ってこわけで、リンクを貼って頂いてるブログにリンク張り返しちゃう(笑)
jQueryスライドショー「bxSlider」がIEで動かない場合の対処法 | いわしブログ
IE11 bxsliderが動かない : 小之介コーディングメモ
実は貼っていただいたお二方とも、jQueryのバージョンが問題で、
1.8.2にしたら動いたみたいです。
ちなみに、、、うさうさんが管理しているサイトは、どのヴァージョンが張ってるのかみたら、
1.7.2と、1.8.2をダブルではってありました。
どのタイミングで2つにしたかは謎(爆)(爆)(爆)
ご参考まで!

Posted in 宇佐兎三用覚書.

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です