<iframe scrolling="no"> にした場合、Google Chrome 23 はiframe要素に対するスクロール機構が働かない

Google Chrome 23 では <iframe src="hoge.html" target="hoge" scrolling="no"> に対して <a href="#; target="hoge"> が期待通りに動作せず、Google Chrome 24 では期待通りに動作する。
2
think49 @think49

@nobuoka 『BTOOOM!』は2期もありそうなので期待ですねー。 ところで、http://t.co/bXhQRAaR をGoogle Chromeで閲覧するとキャラクタークリックでページ遷移しない不具合が気になるのですが、製作者はIEでしか検証してないのでしょうか…。

2012-12-23 21:31:17
think49 @think49

@BTOOOM_anime Google Chrome 23 で http://t.co/bXhQRAaR を閲覧した時、ページ右上のキャラクターをクリックしてもキャラ紹介画像が切り替わりません。iframeのページ遷移が機能していないようですが、修正して頂けないでしょうか。

2012-12-23 21:38:18
think49 @think49

@think49 @BTOOOM_anime 修正方法を模索中。http://t.co/saIxVShl が XHTML 1.0 Transitional として Not Valied である。開発者ツールで <img id="chara02"> に書き換えるも改善せず。

2012-12-23 21:44:20
think49 @think49

@think49 でも、もっと単純な問題のような気もするなあ。そもそも、<a href="hoge,html" target="hoge"> は <iframe name="hoge"> を参照するんだろうか。

2012-12-23 21:51:20
think49 @think49

@think49 Google Chrome 23 で <a href="hoge,html" target="hoge"> は <iframe name="hoge"> を参照したので別の問題みたい。 http://t.co/A0VGDzp6

2012-12-23 22:03:27
think49 @think49

@think49 iframe要素による参照先を http://t.co/saIxVShl に変更してみて期待通りに動作したので、http://t.co/bXhQRAaR のどこかに原因がある模様。 http://t.co/21TNlSuE

2012-12-23 22:21:07
think49 @think49

@think49 わかった。<iframe scrolling="no"> よ、犯人はおまえだ…。 http://t.co/EBsU8sd1

2012-12-23 22:37:57
think49 @think49

@think49 <iframe scrolling="no"> にすると、UAはiframe要素に対してスクロール機構を提供しない。 http://t.co/79nSvla7

2012-12-23 22:41:30
think49 @think49

@think49 Web製作者の意図は恐らく、フラグメント識別子によるスクロールを回避したかったのだろうけど、そもそも使い方が間違っている気がする。 この実装法ならJavaScriptで画像切り替えした方がはるかにマシなんじゃないかなー。

2012-12-23 22:43:24
think49 @think49

@think49 <ifarme src="hoge.jpg" name="hoge"> にするだけで解決しました。某Web製作者さんは考えすぎたんですね、きっと…。 http://t.co/fh828vuY

2012-12-23 22:50:33
think49 @think49

@BTOOOM_anime 解決法がわかりました。 <iframe scrolling="no"> が原因で <iframe src="sakamoto.jpg"> のように画像自身を参照して scrolling="no" を削除すれば現象を回避できます。修正頂ければ幸いです。

2012-12-23 23:02:19
Nobuoka Yuya @nobuoka

@think49 2 期期待ですね! 公式のキャラページはうちの Google Chrome (24 beta) だと問題なくページ切り替えられましたけどねぇ。 (その他 Firefox などでも確認。) いま togetter みてます http://t.co/liE0ueCU

2012-12-23 23:40:00
think49 @think49

@nobuoka うーん…。改めて Google Chrome 23 で全拡張を無効化して JavaScript を Off にして http://t.co/bXhQRAaR を閲覧しましたが、現象は再現しました。何が原因なんだろう…。

2012-12-24 00:53:32
think49 @think49

@think49 @nobuoka ちょっと試して頂きたいのですが、nobuokaさんの環境(GC24beta)では http://t.co/79nSvla7 は期待通りに動作しますか? 私の環境(GC23)は動作しなかったのでこれが原因だと思っていました。

2012-12-24 00:57:26
Nobuoka Yuya @nobuoka

@think49 JavaScript は off にせず (off にする方法がわからなかった...) に Google Chrome 24 beta で試してみたところ、期待通りに動きました。 ちょっと気になるので Chrome 23 もインストールして試してみます。

2012-12-24 01:04:05
Nobuoka Yuya @nobuoka

むー、Google Chrome 24 beta をインストールしてるとこに 23 をインストールしようとしても 24 beta のままだ...

2012-12-24 01:06:01
Nobuoka Yuya @nobuoka

@nobuoka @think49 Chrome 23 のインストールが面倒だったのでとりあえず Chromium 20 で試してみましたが、Chromium 20 だと確かに期待通りに動作しませんでした。 Chrome 23 と 24 beta の間で変わったのかもですね。

2012-12-24 01:15:25
think49 @think49

@nobuoka [設定] -> [詳細設定を表示] で設定項目を増やして、[コンテンツの設定] から [すべてのサイトに対してJavaScriptの実行を許可しない] にチェックを入れることでJavaScriptを無効化できます。

2012-12-24 01:16:06
think49 @think49

@think49 @nobuoka JavaScript を Off にしたのはBTOOOM!のサイトの方でjsfiddleではJS-Onにしてます。

2012-12-24 01:16:43
think49 @think49

@think49 @nobuoka BTOOOM!のサイトでは <iframe scrolling=auto> とHTMLには書かれているのに開発者ツールでDOMを見ると <iframe scrolling="no"> になっているのが気になってました。

2012-12-24 01:17:49
think49 @think49

@think49 @nobuoka ところが、JS-Offにしてみても DOM 上では <iframe scrolling="no"> になります。

2012-12-24 01:19:47
think49 @think49

@think49 @nobuoka 恐らく、GC23 が scrolling="auto" の自動処理の中で scrolling="no" と判定する何かがあるのだろうと思うのですが、それが何であるのかがはっきりしません…。

2012-12-24 01:26:14
Nobuoka Yuya @nobuoka

@think49 ソースコード上は iframe に scrolling=auto と書かれているということですが、それはニュース用の iframe ではないですか? キャラクター表示用の iframe にはソースコード上も scrolling=no と書かれているように思います

2012-12-24 01:26:26
think49 @think49

@nobuoka その通りですね…。私の早とちりでした、すみません。

2012-12-24 01:29:14
残りを読む(17)

コメント

think49 @think49 2012年12月24日
まとめを更新しました。
0
think49 @think49 2012年12月24日
まとめを更新しました。
0