Использование родительской полосы прокрутки для прокрутки iFrame

Я хочу использовать родительскую полосу прокрутки для прокрутки высокого iframe.
Использование родительской полосы прокрутки для прокрутки iFrame

Проблема: мне нужны столбцы для перемещения в процентах вместо пикселя. Это позволило бы обоим стержням одновременно касаться дна.

$(document).scroll(function() { 
    var scrollTop = $(window).scrollTop(); 
    var docHeight = $(document).height(); 
    var winHeight = $(window).height(); 
    var scrollPercent = (scrollTop)/(docHeight - winHeight); 
    var scrollPercentRounded = Math.round(scrollPercent * 100); 

    var divscrollTop = $(window).scrollTop(); 
    var divdocHeight = $(document).height(); 
    var divwinHeight = $(window).height(); 
    var divscrollPercent = (divscrollTop)/(divdocHeight - divwinHeight); 
    var divscrollPercentRounded = Math.round(divscrollPercent * 100); 

    $('div').scrollTop((scrollPercentRounded * divscrollPercentRounded)); 

});

Рабочий пример http://jsfiddle.net/RyanBrackett/xcw1yokm/

источник

2015-03-30 Ryan Brackett

Что есть вы пытались достичь своего результата? Stack Overflow здесь не для написания кода для вас или для простых предложений о том, что делать. – MattD

Я пробовал загрузку вещей, чтобы выполнить не встроенный внешний вид, но через некоторое время понял, что простая прокрутка iframe с помощью полосы прокрутки браузера будет делать то же самое. Просто смотри здесь предложения. –

Что я имею в виду, вам нужно отправить код, который вы написали, чтобы попытаться решить проблему, с которой вы столкнулись. Детально, что с ним не работает, и каков должен быть ожидаемый результат. – MattD

Я только что нашел этот пост и провести несколько минут, играя с кодом, чтобы заставить его работать. Вот моя версия кофе-скрипт-код:

$(window).load(function(){ 
     $(document).scroll(function() { 
     var scrollTop = $(window).scrollTop(); 
     var docHeight = $(document).height(); 
     var winHeight = $(window).height(); 
     var scrollPercent = scrollTop/(docHeight - winHeight); 

     var divHeight = $("div").height(); 
     var divContentHeight = $('div')[0].scrollHeight; 

     var equation = scrollPercent * (divContentHeight-divHeight); 

     $('div').scrollTop(equation); 

    }); 

});

/Рене

источник

2015-09-18 10:16:31

Это действительно здорово! Моя математика была где-то не так, но это работает, как мне нужно. Спасибо, Рене! –

Я не это старый вопрос, но можно также просто отключить родительский скроллбар и позволить IFrame быть главным полоса прокрутки. Конечно, это работает, только если вы можете установить ширину 100% или 100vw.

В таком случае вместо этого вы можете просто установить маржу всех элементов на 0px и переполнение на скрытые от родителя.

Затем установите IFRAME 100 VW и (по желанию) 100 ВХ

IFrame затем 100% контролируется родителем, содержащего полосу прокрутки, как показано ниже:

<style> 
 
     * { margin:0px; } 
 
     body {overflow:hidden;} 
 
    </style>

<iframe src="https://marketers.coop" style="min-width:100vw; min-height:100vh;">

источник

2017-04-19 03:05:13 Bruce

Использование родительской полосы прокрутки для прокрутки iFrame

ответ

Смежные вопросы