(WordPress)スマートフォン対応って意外と手間かかりますよねコンバンハ。Colorbox」を導入しました。このプラグインを導入すると、エントリー内の画像をクリックした時に綺麗なエフェクトで画像を拡大してくれます。ところがこのプラグイン、スマートフォンで画像をクリックするといただけないことになります。今回はその回避策を書きます。スマートフォンで画像をクリックすると...画像どこや(=ω=)このような状態になります。この状態を解除するバツボタン(X)がどこかにいってしまいます。Colorboxを動かさないようにします。プラグインの中に、下記のjavascriptを書き込むだけ。return;内容は「ユーザーエージェントにiphone/androidという文字があったら、この後ろの処理(colorboxの処理)は実行しない」というシンプルなものです。これをプラグインのファイルに書き込みます。Colorbox」を探し、「編集」を押します。画面右側にプラグインファイル名がずらっと並んでいます。その中から「jquery-colorbox/js/jquery-colorbox-wrapper-min.js」を選択します。画面にびっしりとコードが書かれていると思います。この内容を一旦、全てコピーして、メモ帳かどこかに貼り付けて保存しておきましょう。プラグイン編集に失敗した時は、そのメモ帳の中身から復元します。「jQuery(document).ready(function(){」という文字を探します。上のほうにあるはず...。※画像クリックで拡大この「{」の直後に、↑に書いた一行のjavascriptをペーストします。「ファイルを更新」ボタンを押して保存します。作業は以上!これでiPhoneやAndroid端末からアクセスした時はColorboxは動作しないはず!何かおかしい場合は、メモ帳にコピーしておいたコードをjquery-colorbox/js/jquery-colorbox-wrapper-min.jsに戻してあげればOKです。スマートフォンでも綺麗に動作するlightbox系プラグインって無いのかなぁ。時間あるときに探してみようかな...。02:33お役に立てて何よりです!スマートフォン用のLightboxでいいものないかなぁ。作ってしまうか・・・。レスポンシブ対応でとっても快適に表示しますよ。スマホ画面内で拡大表示してくれてます。ご存知かもしれないですが、、、。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイトスパム対策のため、コメントする際は下記の計算式を埋めてください。計算式の有効期限が切れました。計算式の隣にある再読み込みボタンを押してください。コメントデータの処理方法の詳細はこちらをご覧ください。このブログについてころすけと申します。関東でプログラマーをしています。JavaScriptあたりがお気に入り。当ブログでは私が作ったもの、考えたこと、撮影したものなど、全てをごった煮で書き綴るブログです。よろしければおつきあい下さいませ。プロフィールについて、詳しくはコチラへどうぞ。