Событие прокрутки iframe/frame jquery

Тема в разделе "Другие языки", создана пользователем Delayer, 21 мар 2011.

Модераторы: Цукер
  1. Delayer

    Delayer Создатель

    Регистр.:
    4 июл 2009
    Сообщения:
    39
    Симпатии:
    4
    Здравствуйте, подскажите пожалуйста как отловить прокрутку iframe/frame из jquery. Чтото пол инет облазил ничего найти не могу.

    Пробовал повесить на фрейм событие, ничего не получилось, видать нет такого

    PHP:
    $('#myframe').scroll(function() {
    alert('111');

    })
     
  2. alica

    alica

    Регистр.:
    28 июл 2008
    Сообщения:
    243
    Симпатии:
    76
    Фреймы у jquery по другому подключаются.
    <iframe id = "a" src="a.html"></iframe>
    $("#b").contents()....;
     
  3. Delayer

    Delayer Создатель

    Регистр.:
    4 июл 2009
    Сообщения:
    39
    Симпатии:
    4
    все равно не работает, сделал так:
    PHP:
        $(document).ready(function(){
            $(
    '#mainframe').contents().scroll(function(){
                
    alert('111');
            });
        })
     
  4. polyetilen

    polyetilen Заблокирован

    Регистр.:
    10 авг 2006
    Сообщения:
    814
    Симпатии:
    474
    работает через document.getElementById("iframe2").contentWindow но ифреим должен быть с того же домена что и страница в которой ифрейм, иначе доступ будет неразрешён. Или универсально обернуть ифреим и уже отслеживать прокрутку обёртки, одна проблема высота ифреима, но можно подогнать чтоб полосок прокрутки не было и тогда поставить нужный размер обёртки.

    HTML:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Untitled Document</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <script type="text/javascript">
    
    //обёртка ифрейма
    $(document).ready(function(){
        $("#div_iframe").scroll(function(){ 
            $("#alert").css("display", "inline").fadeOut("slow");
        });
        
    });
    
    
    //iframe на том же домене
    window.onload = function() {
        var frm = document.getElementById("iframe2").contentWindow;
        frm.onscroll = function(){
            $("#alert2").css("display", "inline").fadeOut("slow");
        }
    }
    
    </script>
    
    </head>
    <body>
    
    <div id="div_iframe" style="width:1100px; height:500px; overflow:auto;">
        <iframe src="https://nulled.cc" width="1080" height="7000" id="iframe" style="margin:0;padding:0;" frameborder="0"></iframe>
    </div>
    <div id="alert" style="color:red;display:none;">обёртка ифрейма - прокрутка есть!</div>
    <br />
    
    <iframe src="test.html" width="100" height="100" id="iframe2" style="margin:0;padding:0;border:none;"></iframe>
    <br />
    <div id="alert2" style="color:red;display:none;">iframe на том же домене - прокрутка есть!</div>
    <br />
    
    </body>
    </html>
    
    
     
    Delayer нравится это.
  5. Delayer

    Delayer Создатель

    Регистр.:
    4 июл 2009
    Сообщения:
    39
    Симпатии:
    4
    Работает, спасибо большое!

    И еще вопрос в догонку по этой же теме, как определить что страница прокручена вверх полностью? ну вот этот див т.е. У меня задача в общем в том, что когда страница грузится, появляются 2 блока рекламы, когда юзер прокручивает вниз они исчезают, а когда прокручивает снова вверх должны появится.
     
  6. polyetilen

    polyetilen Заблокирован

    Регистр.:
    10 авг 2006
    Сообщения:
    814
    Симпатии:
    474
    scrollTop() возвращает значение сколько прокручено в пикселях с верха, если 0 значит прокручена вверх полностью.

    HTML:
    
        $("#div_iframe").scroll(function(){ 
            alert($(this).scrollTop());
        });
    
    http://api.jquery.com/scrollTop/
     
    Delayer нравится это.