Как прокрутить iframe вниз при загрузке страницы?

Я был похож на каждый вопрос об этом в сети, пробовал как 50 методов diff, сначала я попытался прокрутить div-затем, когда он не работал, я попытался iframe файл с div и прокрутить iframe.. ничего не работает!

посмотрите на последний скрипт, который я настроил:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var t = 100; //arbitrary time in ms
$("#frame").animate({ scrollTop: $("#frame").height()}, t);
});
</script>

<center><iframe id="frame" src="xxx.php" frameborder="0" width="630px" height="500px"></iframe></center>

я попробовал как # frame, так и frame без ( # ), как с (document).готов и без него. Кажется, ничего не работает на странице, и это сводит меня с ума.

спасибо. :)

3 ответов


С jQuery вам нужно использовать .contents() для доступа к тому, что находится внутри iframe. Также необходимо использовать событие загрузки окна или событие готовности документа iframe.

$(window).load(function ()
{
    var $contents = $('#frame').contents();
    $contents.scrollTop($contents.height());
});

демо:http://jsbin.com/ujuci5/2


Я бы рекомендовал вернуться к структуре div, о которой Вы упомянули, поскольку похоже, что то, что вы пытаетесь сделать, не требует iframe. Вы обнаружите, что это намного меньше головной боли, чтобы работать с div, чем фрейм.

$(function ()
{
  var $mydiv = $('#mydiv');
  $mydiv.scrollTop($mydiv.height());
});

демо:http://jsbin.com/ujusa4/2


как запустить функцию прокрутки через 3 секунды после загрузки страницы?

использовать setTimeout.

$(window).load(function ()
{
    setTimeout(function ()
    {
        var $contents = $('#frame').contents();
        $contents.scrollTop($contents.height());
    }, 3000); // ms = 3 sec
});

Если у вас есть доступ к исходному коду содержимого iframe, один простой трюк-добавить (или последнюю строку вашего содержимого) (не уверен, что вам действительно что-то нужно в теге ).

добавить #end в источник iframe, например

http://www.yourdomain.com/file.php#end

и он будет автоматически прокручиваться до конца, не требуется javascript/jquery


если текущий документ готов, это означает, что DOM готов, но документ внутри iframe также должен быть загружен.

<script type="text/javascript">
$(document).ready(function() {
  $("#frame").load(function(){this.contentWindow.scrollBy(0,100000)});
});
</script>