iPadでスクロールができない。

Question

デバイス:iPad air
OS:iOS
OSバージョン:11.2.2（最新）

困っています。
ご教授を至急お願いします。

スクロールバーを付けて、スクロールが可能にしたいのす。
Chrom, IEでは以下の cssを付けてスクロールバーの表示も、中身のスクロールもできます。

.scroll_bar {
overflow-x: scroll;
overflow-y: scroll;
}

しかし、iPad air では、スクロールバーも出ませんし、スクロールも出来ません。

よろしくお願いいたします。

申し訳ありません。
<code>で囲みました。

単純に以下の様なことが出来ればいいのですが、ピクリともしませんｗ

<div style="height:100px; width:300px; overflow-x:scroll; overflow-y:scroll;">
	<table border=1 height="100" width="300" bgcolor="#9999ff">
	<tr>
		<td>
		　　　表示したいテーブル1
		</td>
	</tr>
	<tr>
		<td>
		　　　表示したいテーブル2
		</td>
	</tr>
	<tr>
		<td>
		　　　表示したいテーブル3
		</td>
	</tr>
	</table>
</div>

あと、-webkitを使ってみたのですが、変わりません。

追加します。
使用デバイスに、iPad air と書きましたが、「iPad Wi-Fi 32GB 2017年春モデル MP2G2J」でも同じ現象が発生します。

Comments

[kei344]

質問文のコードはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

[kocyan]

申し訳ありません。修正しました。

Answer 1

実機が無いので、ChromeのディベロッパーツールでデバイスをiPadにして下記を表示したところ、スクロールしませんでした。

<div style="height:100px; width:300px; overflow-x:scroll; overflow-y:scroll;">
    <table border=1 height="100" width="300" bgcolor="#9999ff">
    <tr>
        <td>
        　　　表示したいテーブル1
        </td>
    </tr>
    <tr>
        <td>
        　　　表示したいテーブル2
        </td>
    </tr>
    <tr>
        <td>
        　　　表示したいテーブル3
        </td>
    </tr>
    </table>
</div>

tableのheightを200に変更し表示したところ、スクロールバーは表示されませんでしたがスクロールはできました。

<div style="height:100px; width:300px; overflow-x:scroll; overflow-y:scroll;">
    <table border=1 height="200" width="300" bgcolor="#9999ff">
    <tr>
        <td>
        　　　表示したいテーブル1
        </td>
    </tr>
    <tr>
        <td>
        　　　表示したいテーブル2
        </td>
    </tr>
    <tr>
        <td>
        　　　表示したいテーブル3
        </td>
    </tr>
    </table>
</div>

一度、わざとはみ出すような内容で確認していただくことはできますか？

Comments

[kocyan]

有難うございます。

Answer 2

↓ この辺 関係ありますか？（余所様のブログですが）

https://blog.sus-happy.net/iphone-ipad-overflow/

iPhone、iPadでのoverflow:scroll/autoの動作について

＃ 「ipad scroll」でググった

追記：

↓ また余所のブログ

https://qiita.com/chocolamint/items/67d25933880404c93db0

iOS Safari で絶対位置指定された要素のスクロールが出来ない件

position:fixed とかを指定しているとスクロールできない、という記事がいくつかヒットしました。
この div の親要素に絶対位置が指定されていたりはしないでしょうか。

Comments

[kocyan]

ご返信ありがとうございます。

「iPad（iPhone）の困った仕様 」の「（２）divでoverflow:scrollなどの指定をしたとき」に該当します。
ここで書かれている事象を見ますと、「２本指でなぞると、スクロールします。」と書かれていますが、スクロールしません。
気のせいかもしれませんが、今回のバージョンにアップデートする前は、スクロールバーは出ていませんでしたが、スクロールは出来てたように覚えています。

[kocyan]

ご返信ありがとうございます。

position:fixedは定義していません。
単純に上記の様なコードで動かしてみましたが、スクロールしません。
iPadがスクロールしないなて、意味不明です・・・。
もし、iPadを持たれていて、iOSバージョンが 11.2.2 でしたら、上記のコードで試してみてください。

[sk_3122]

今日 iPad 家なんですよねー･･･ スマホは Android なので･･･
お役に立てなくてごめんなさい;;

[kocyan]

いえいえ。
有難うございます。