1. #1
    Sencha User
    Join Date
    Nov 2009
    Posts
    21
    Vote Rating
    0
    extusr is on a distinguished road

      0  

    Default 要素が画面内に入ったときに発火するイベント

    要素が画面内に入ったときに発火するイベント


    ExtJS4 を勉強中のものです。
    よろしくお願いいたします。

    要素が画面内に入ったタイミングで処理をおこないたいと思っているのですが、
    そのようなイベントもないようですし、手段が思いつかず手をこまねいています。

    なにかアイディアをお持ちの方がいらっしゃいましたら、
    どうかご教授願いたくお願い申し上げます。

  2. #2
    Ext JS Premium Member
    Join Date
    Jun 2010
    Posts
    13
    Vote Rating
    0
    tenri-u is on a distinguished road

      0  

    Default


    「要素が画面内に入ったとき」
    というのは何を指すんですか?

  3. #3
    Sencha User
    Join Date
    Nov 2009
    Posts
    21
    Vote Rating
    0
    extusr is on a distinguished road

      0  

    Default


    表現があいまいで申し訳ございません。

    HTMLが読み込まれ、対象のタグをブラウザが描画したタイミングではなく、
    描画されたタグがスクロールされ、実際画面内に表れたタイミングのことを指しています。

    たとえば本ウェブページですと、大抵のクライアント環境では、最下部iにある
    HTML Code:
    <p>&copy; 2012 Sencha Inc. All rights reserved.</p>
    この要素はファーストビューに入りません。
    画面をスクロールしていき、この要素が画面内に出現したときに、
    なにかしらの処理をおこないたいのです。

    なにとぞ、ご助言のほどよろしくお願い申し上げます。

  4. #4
    Ext JS Premium Member
    Join Date
    Jun 2010
    Posts
    13
    Vote Rating
    0
    tenri-u is on a distinguished road

      0  

    Default


    そういうことでしたか。
    ボディエレメントのscrollイベントをリスニングして、
    ボディエレメントのgetScrollでスクロール量を調べて、
    対象エレメントのgetTopなどと比較して画面内に入っているかどうかを判定する

    ぐらいしか思いつきません。もっといい方法あるのかな。

  5. #5
    Sencha User
    Join Date
    Mar 2010
    Posts
    34
    Vote Rating
    0
    shobuno is on a distinguished road

      0  

    Default


    これって難しくないですか?

    ブラウザが小さく表示されていて、ユーザーがブラウザの高さを大きくした場合にもイベントを発生させたいってことですよね。

    tenri-uさんのやり方+ウィンドウのサイズ変更イベントも取って処理しないと…

    普通は「マウスが要素に入ったら」とかで処理しますからね・・・


    ちなみに、具体的には何がしたいんですか?
    別の方法で実現できるかもしれませんよ。

  6. #6
    Sencha User
    Join Date
    Nov 2009
    Posts
    21
    Vote Rating
    0
    extusr is on a distinguished road

      0  

    Default


    ご助言いただきましてありがとうございます。

    アドバイスの内容をもとにいろいろと実験を続けていますが、
    まだ成功には至っていない状況です。

    具体的には、Ajaxで動的に読み込むコンテンツを、
    画面に出力しなければならなくなったタイミングで読み込みたいのです。

    ページの下部のほうにあって、ページを表示した時点では表示が不要なコンテンツについては、
    読み込まないようにしたいという意図があります。

  7. #7
    Sencha User
    Join Date
    Mar 2010
    Posts
    34
    Vote Rating
    0
    shobuno is on a distinguished road

      0  

    Default


    Quote Originally Posted by extusr View Post
    ページの下部のほうにあって、ページを表示した時点では表示が不要なコンテンツについては、
    読み込まないようにしたいという意図があります。

    ん~こういうページは見たことが無いので何とも言えません。
    私が考える対応策は2点です。


    1.
     通常、ページの下の方にあるものは、Ajaxを遅延呼び出しにしてしまいます。
     そうすれば、画面上部にある物を先に読み込ませて、一定時間後に下の物の読み込みを開始します。

     よく、ページ読み込みの途中でいきなりスクロールバーが小さくなるのは、この処理をしていると思います。


    2.
     要素全体(Bodyかな?)の高さと、スクロールバーの移動量を計算し、その値を元にAjaxを呼び出すようにする。
     そうすれば、Googleの画像検索のように、スクロールバーの移動量に応じて必要なデータが読み込めます。


    googleの画像検索を見て思いましたが、「要素が画面に表示されてからAjaxを読み込む」では、
    要素の表示が遅くなり、ユーザーは使いづらいと思います。
    そのため、通常では「先読み」をするのではないでしょうか…?



    こんな感じにしたいんじゃないのかな?実装方法は不明だけど…
    ttp://www.flickriver.com/groups/1592737@N25/pool/interesting/


    ご指摘、新案お待ちしております。


    ちなみに、Flashなどは、使ったこと無いので良く判りません!
    Last edited by shobuno; 15 Feb 2012 at 8:05 PM. Reason: 参考になるURLを追加

  8. #8
    Sencha User
    Join Date
    Nov 2009
    Posts
    21
    Vote Rating
    0
    extusr is on a distinguished road

      0  

    Default


    たくさんのご助言誠にありがとうございます。

    ウィンドウサイズ監視とスクロール監視の組み合わせで、
    どうにかやろうとこねくり回していましたが、最終的に、
    先読みがないと使いにくいのでは、というご指摘のとおり、
    今回は要件を見直し、またいずれチャレンジしようということになりました。

    なんらかのシーンでは用途はありそうな予感がしますので、
    また進展がありましたらこちらにてご報告申し上げます。

    ご意見、アイディアをありがとうございました!

Thread Participants: 2

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi