お役立ち記事!
TablePress 水平スクロール機能がうまく動かないトラブルの解決法

普段、バイクブログを書いているが、様々な部品の紹介や機能を比較する時などにプラグインのTablePressが非常に役に立っている。 使いやすいしちゃっちゃと表を作成できるし、リンクや画像挿入、CSSも自由に追記できるので本当に神プラグ。

そんな中、この記事を書く時に合計5つのテーブルを作成した。 スマホでのレスポンシブにも対応しており表が横長の場合は「水平スクロール機能」にチェックを入れる事で表が横にスライドできるようになり、縦長画面のスマホでは無くてはならない機能である。

1番目のテーブルは問題なく水平スクロールが動いており問題なし。

2番目のテーブルはスマホ上でも水平スクロールしないから問題なし。

3&4番目の一番重要なテーブルが水平スクロール機能をONさせても水平スクロールしない・・・。

水平スクロールしない原因

  • セルを結合して作成したテーブル以後(下)に挿入した事が機能不良発生の原因である
  • セルを結合して作成したテーブル以前(上)に挿入した場合は問題なし。

それはもうググりまくって解決策を探したがまーーーーったく見つからない! 仕方なしに自分でトライアンドエラーを繰り返す。

以前作成し現在も水平スクロールが効いているテーブルのショートコードをそっくりそのまま持ってきても、ダメ!

テーブルをコピーで作成せず、0から新規作成してもダメ!

機能のON-OFFを切り替えるチェックボタンをいじくり倒してもダメ!

そんな事を繰り返すうち、水平スクロールの効かないテーブルidを、記事の一番上にコピーしたところ、水平スクロールが効く!! ・・・なぜ??

ここまで来てやっと気付きました。 テーブルを記事ページに複数挿入する場合は、セルを結合させて作成したテーブルよりも後(下)に水平スクロール機能をONさせたテーブルを設置しても、左右に動きません。

セルの結合は他にもトラブルを起こすそうですから、何か動作ファイルがバッティングしているのかもしれません。

結合させていたテーブルを作り変えたところ・・・バッチリ動くようになりました。

Googleで探しまくても解決方法が出てこなかったので一応書いてみました。

同じ境遇の方の時短になれば嬉しいです。

 

 

この記事が気に入ったら フォローしよう

最新情報をいち早くお届けします。

Twitterでフォローしよう