スマホでテーブルのスクロールをなくした...
 
Notifications

スマホでテーブルのスクロールをなくしたい  

  RSS

kohf
 kohf
(@kohf)
New Member
参加: 4か月 前
投稿: 1
18/03/2020 6:46 pm  

スマホではテーブルがスクロールする仕様ですが、スクロールしないようにしたいです。


引用
永田
(@lucy_ngt)
New Member
参加: 4か月 前
投稿: 3
18/03/2020 7:11 pm  
テーブルがスクロールしないようにするには、テーマファイル内
lib/functions/asset.php内にあるtable-scrollに関する行を2箇所 削除いただく必要がございます。
 
lib/functions/asset.php
XeoryBase L.41付近 、XeoryExtension L.31付近
    wp_register_script('table-scroll', get_template_directory_uri().'/lib/js/jquery.table-scroll.js', array('jquery'), false, true );


XeoryBase L.46付近 、XeoryExtension L.37付近
    wp_enqueue_script('table-scroll');

返信引用
nakae
(@nakae)
New Member
参加: 1か月 前
投稿: 1
11/06/2020 11:22 am  

@lucy_ngt

便乗で質問させていただきます。

asset.php内の記述の削除したところ、テーブル内の文字が長すぎるとスマホの表示では切れて見えません。

スマホ表示でも枠内に収まるように自動で改行するようにはできませんでしょうか?

 


返信引用
永田
(@lucy_ngt)
New Member
参加: 4か月 前
投稿: 3
12/06/2020 4:35 pm  

@nakae 様 ご質問いただきありがとうございます。

tinyMCEを使用してテーブルの検証を行いましたが、

はみ出す分の調整は難しいようでした。

 

そのため、内容に合わせてテーブルのレイアウトを変える方法がおすすめでございます。

弊社ではよくstyle.cssで下記のように指定して、横幅の小さなスマホでも見やすいよう調整をしております。

@media screen and (max-width: 550px) {

.post-content table th, .post-content table td {

display: block;

}

}

 

 

This post was modified 3週間 前 2 times by 永田

返信引用
Share:

コンテンツマーケティングを得意とするバズ部が、自信を持ってお届けする
Xeoryカスタマイズサービス

自社サイトを運営し、
試行錯誤しながら蓄積してきた知見を
惜しみなく提供

私たちはデザイン会社ではなくマーケティング会社です。
例えばデザイン会社はおしゃれなサイトにこだわりますが、私たちは成果が出るサイトにこだわります。

目指す成果との因果関係・相関関係をデータから紐解き 実現可能性の高いアイデアを選別し、計画、実行していきます。

※料金は内容によって異なります


サイト制作の相談をする