別フレームにスムーススクロールを使用したい。

締切済

質問者：maccccco
質問日時：2010/10/12 13:55
回答数：4件

別フレームにスムーススクロールを使用したい。

Javascript初心者です。
自分自身でも色々調べたのですが、どうしても分からないことがあり、お力を貸して頂ければと思います。

http://user1.matsumoto.ne.jp/~goma/js/ps2.html
こちらのサイト様のようにスムーススクロールを使った移動を使いたいと考えております。
上記サイト様で使われているスクリプト等は理解出来ております。

今回、この応用として、
別フレームでスムーススクロールを使用するということをしたいと考えております。
(上記サイト様は、同じページ内での移動ですが、今回はボタン(リンク部分)と移動するページが
それぞれ別フレームになっているものを考えております。)

このようなやり方を紹介しているサイト様、もしくは書籍などご存知でしたら教えて下さい。
もしくは、上記サイト様のスクリプトをどのように応用すれば良いかなど教えて下さい。

どうぞ宜しくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

最新から表示
回答順に表示

No.4

回答者： yyr446
回答日時：2010/10/13 10:31

質問の画像を良く見ると、別に<iframe>でも<frameset>でも無さげだ。

そもそも、フレーム要素とは誰も言ってない。早とちりか！

単なる<div>ボックスのスクロールでよかったのかしらん？
となるとこのライブラリーはアンカーめがけてスクロールするだけだから
使えないよ。別の仕組みを作るか、探すかしないと．．．

- 0
- 件

通報する

No.3

回答者： yyr446
回答日時：2010/10/13 10:12

幸い単純なスクローラーの仕組みだったみたいで、楽な方法で出来ますね。

- 0
- 件

通報する

No.2

回答者： yyr446
回答日時：2010/10/12 18:52

<iframe id="iframe1" src="/hoge.html" ></iframe>

という<iframe>要素があったとして、
そのiframeのWindowオブジェクトは、
　var iframe = document.getElementById("hoge");として
iframe.contentWindow で取得可能

よってiframe内のスクロールなら、
iframe.contentWindow.scrollTo(X,Y);
※X,Yはiframe内の移動量

iframe内の要素の取得は、iframe内のdocumenntオブジェクトは、
iframe.contentDocumentで取得可能
※古いIEだと、iframe.contentWindow.documentでよい
よって、
var content=iframe.contentDocument||iframe.contentWindow.document;
とすれば、
content.getElementById("xxx")
の様にiframe内の任意の要素が取得できる。

しかし、取得した要素の高さ・幅や位置（X,Y）の取得は、ブラウザーに
よって方言があり、振り分け方法が煩雑で面倒になる。

さらにバブリングするイベントのIEでの取得は、さらに面倒
iframe.contentWindow.document.attachEvent('onclick', function(){
alert(iframe.contentWindow.event.clientX);
});

よって、無理にiframe内のDOMを操作するよりは、iframe内のHTMLにも
親と同じjavascriptライブラリーをロードしておいて、親のjavascript
から、子供のjavascriptを操作するようにした方が楽じゃないかな。