Iframe scrollbar align to right

只谈情不闲聊 提交于 2020-01-24 09:06:27

问题


There is a way to align the scroll bar from an iframe to right? its by default to left.
any idea?

take a look here i wanna see the search box when i load the page!

i have an application that has an ifram, in the ifram I'm loading a website that the search box is on the upper right,
and i want that when the page loads i should be able to see the search box right away without having to scroll to the right.... something not clear?


回答1:


can you use jquery? if yes, you can do the following:

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p>This is some text. This is some text. This is some text.
<div id="frame" style="width: 200px; height: 200px; overflow: scroll";>
<iframe src="http://www.w3schools.com/default.asp" width="1024" height="768" scrolling="no">
<p>Your browser does not support iframes.</p>
</iframe>
</div>
This is some text. This is some text. This is some text.</p>
<p>The align attribute was deprecated in HTML 4, and is not supported in HTML 4.01 Strict DTD or in XHTML 1.0 Strict DTD. Use CSS instead.</p>
<script type="text/javascript">
jQuery(document).ready(function () {
$("#frame").scrollTop(10).scrollLeft(750);
});
</script>
</body>
</html>

If you copy and paste the code into a html file and open it in your browser, you'll see that the iframe is automatically scroll to the very right.

The key changes are:

  1. import jquery in your html file
  2. add scrolling="no" to your iframe
  3. specify the width and height of your iframe, it should be roughly the same as the actualy width & height of the embedded page
  4. wrap your iframe in a <div>, be sure to specify the width & height (less than the iframe width & height)
  5. add the javascript code before the closing </body> tag

    <script type="text/javascript"> jQuery(document).ready(function () { $("#frame").scrollTop(10).scrollLeft(800); }); </script>



来源:https://stackoverflow.com/questions/11873515/iframe-scrollbar-align-to-right

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!