Не работает скролл iframe

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

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

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

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

3 ответов

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

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

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

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

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

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

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

Источник

Нет скролла в Frame

Спросил Coshe,
1 декабря 2013

Вопрос

Coshe

Есть 2 фрейма, но во втором, где должен быть контент, нет полос прокрутки, скролла. Я пробовал самые разные способы: добавлял div в котором был overflow, scrolling=»yes/auto», ничего не помогло. В чем может быть проблема?

Ссылка на комментарий

Поделиться на других сайтах

8 ответов на этот вопрос

Рекомендованные сообщения

Присоединяйтесь к обсуждению

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

Похожие публикации

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

При переходе по ссылке во фрейме CONTENT опусташается данный фрейм, но ссылка не появляется.
P.s. Строго не судите, я совсем чайник. И на контент внимания не обращайте, это так, практикую навыки.

Всем привет. Столкнулся с такой необъяснимой проблемой:
Имеется страница на которой есть текстовые инпуты и кнопка, которая открывает фрейм с другими инпутами.
Имеется userscript, которые реализует функционал виртуальной клавиатуры http://userscripts-mirror.org/scripts/show/10974
Он работает на всех страницах в яндексе, в гугле, в инпутах на моём сайте, но не работает в инпутах внутри открывающегося фрейма
Почему внутри фрейма может не выполняться userscript? В консоле браузера нет ни каких ошибок и вызова юзерскрипта.

Так же интересуют альтернативные варианты создания(подключения) виртуальной клавиатуры внутри фрейма с чужим сайтом.

Источник

Scrolling an iframe with JavaScript?

I dynamically load an iframe with JavaScript. After it’s loaded, how can I make it scroll down a specific number of pixels (ie. after the page in the iframe has loaded, how can I make the iframe scroll by itself to the a specified region of the page?)

9 Answers 9

You can use the onload event to detect when the iframe has finished loading, and there you can use the scrollTo function on the contentWindow of the iframe, to scroll to a defined position of pixels, from left and top (x, y):

You can check a working example here.

Note: This will work if both pages reside on the same domain.

Inspired by Nelson’s comment I made this.

Workaround for javascript Same-origin policy with regards to using.ScrollTo( ) on document originating on an external domain.

Very simple workaround for this involves creating a dummy HTML page that hosts the external website within it, then calling .ScrollTo(x,y) on that page once it’s loaded. Then the only thing you need to do is have a frame or an iframe bring up this website.

There are a lot of other ways to do it, this is by far the most simplified way to do it.

*note the height must be large to accommodate the scroll bars maximum value.

Inspired by Nelson’s and Chris’ comments, I’ve found a way to workaround the same origin policy with a div and an iframe :

Now suppose I want to skip the first 438 (vertical) pixels of the iframe page, by scrolling to that position.

(Each solution alone is enough, and the effect of the CSS one is a little different since you can’t scroll up to see the top of the iframed page.)

Use the scrollTop property of the frame’s content to set the content’s vertical scroll-offset to a specific number of pixels (like 100):

A jQuery solution:

Or, you can set a margin-top on the iframe. a bit of a hack but works in FF so far.

I’ve also had trouble using any type of javascript «scrollTo» function in an iframe on an iPad. Finally found an «old» solution to the problem, just hash to an anchor.

In my situation after an ajax return my error messages were set to display at the top of the iframe but if the user had scrolled down in what is an admittedly long form the submission goes out and the error appears «above the fold». Additionally, assuming the user did scroll way down the top level page was scrolled away from 0,0 and was also hidden.

to the top of my iframe document and

to the top of my top level page

You have to hash the iframe before the top page or only the iframe will scroll and the top will remain hidden but while it’s a tiny bit «jumpy» due to the timeout intervals it works. I imagine tags throughout would allow various «scrollTo» points.

Источник

Предотвратить прокрутку родительской страницы, когда мышь находится над встроенным iframe в Firefox

. без ограничения прокрутки внутри iframe или необходимости специально называть / маркировать все прокручиваемые элементы.

Представьте себе виджет Google Maps, встроенный в родительскую страницу. Очевидно, что при увеличении виджета вы не хотите, чтобы родительская страница прокручивалась.

Во время прокрутки внутри фрейма тело ничего не знает о том, что там происходит. Но когда скроллер iframe достигает дна или вершины, прокрутка переходит к телу.

Отмените событие, которое распространяется из iframe.

Но решение не работает в Firefox, потому что Firefox не будет — по замыслу — распространять события, захваченные iframe на родительскую страницу, но странным образом она будет прокручивать родительскую страницу. См. jsfiddle здесь.

Итак, как я могу предотвратить прокрутку страницы, когда пользователь увеличивает масштаб содержимого во встроенном iframe в Firefox?

3 ответа

Поскольку это ошибка в Firefox, обходной путь должен работать непосредственно с событием scroll , а не с mousewheel / DOMMouseScroll .

Я так и сделал: когда пользователь вводит указатель мыши над iframe , я устанавливаю флаг true , а когда он оставляет мышь там, я возвращаю ему значение false .

Затем, когда пользователь пытается прокрутить, но стрелка мыши находится внутри iframe, я запрещаю прокрутку родительского окна. Но, к сожалению, вы не можете предотвратить прокрутку окна с помощью обычного метода e.preventDefault() , поэтому нам все еще нужен другой обходной путь, заставляющий окно прокручиваться точно в те положения X и Y, которые уже были раньше.

Я создал немедленно выполняемую функцию, чтобы предотвратить определение переменной s в глобальной области видимости.

Редактировать

Поскольку ваш вопрос не был помечен с помощью jQuery (хотя внутри него вы показали код, использующий библиотеку), решение с использованием vanilla JS так же просто, как и выше:

Учитывая все предварительные условия, я думаю, что следующий — самый разумный способ сделать эту работу в Firefox.

Оберните ваш iframe div , который немного короче, чтобы включить в нем вертикальную прокрутку:

Теперь вы можете центрировать iframe по вертикали и перемещать его каждый раз оболочка получает событие scroll (это произойдет, когда пользователь попытается прокрутить края кадра):

Добавьте к этому предыдущее исправление для Chrome, и оно должно охватывать все основные браузеры. Вот рабочий пример — http://jsfiddle.net/o2tk05ab/5/

Единственной нерешенной проблемой будет видимая вертикальная полоса прокрутки на оболочке div . Существует несколько способов, например: Скрыть прокрутку панель, но все еще в состоянии прокручивать

Я думаю, что решит вашу проблему, это решило мое

Замените ‘.slimScrollDiv’ на селектор элемента, который вы хотите запретить родительскую прокрутку, когда на нем находится мышь

Источник

Удалить полосу прокрутки из iframe

используя этот код

вот как это выглядит (shoutbox на главной странице http://www.talkjesus.com)

Как удалить горизонтальную полосу прокрутки и изменить css вертикальной полосы прокрутки?

10 ответов

добавить scrolling=»no» атрибут iframe.

это работает во всех браузерах. jsfiddle здесь http://jsfiddle.net/zvhysct7/1/

добавлять scroll=»no» и style=»overflow:hidden» на iframe не работал, мне пришлось добавить style=»overflow:hidden» на теле html-документа, загруженного внутри iframe.

используйте вышеуказанный div, и он не будет показывать полосу прокрутки в любом браузере.

Просто Добавить scrolling=»no» и seamless=»seamless» атрибуты тега iframe. вот так: —

добавьте это в свой css, чтобы скрыть обе полосы прокрутки

если у кого-то здесь есть проблема с отключением полос прокрутки на iframe , Это может быть потому, что содержимое iframe имеет полосы прокрутки в элементах ниже на html элемент!

некоторые макеты set html и body до высоты 100%, и используйте #wrapper div с overflow: auto; (или scroll ), тем самым перемещая прокрутку в #wrapper элемент.

в таком случае ничто из того, что вы делаете, не помешает полосам прокрутки отображаться, кроме редактирования другого содержание страницы.

добавьте это в свой css, чтобы скрыть только горизонтальную полосу прокрутки

Это последнее средство, но стоит упомянуть — вы можете использовать ::-webkit-scrollbar псевдо-элемент iframe родитель, чтобы избавиться от этих знаменитых 90-х полос прокрутки.

Edit: но это относительно поддерживаемой, ::-webkit-scrollbar может не подходить для всех браузеров. используйте с осторожностью:)

Источник