javascript - How do I scroll to s specific location in an iframe? -
i have found 1 way uses js, rather use css, think had seen used before, cannot remember how. kind of css use position webpage inside , iframe?
create anchor in iframe: <a id="abottom"/>. now, need anchor added in iframe , anchor's offsettop:
var position = window.frames["anchor_iframe"].document.getelementbyid("abottom").offsettop; now, set iframe scrolltop position
window.frames["anchor_iframe"].document.body.scrolltop = position; iframe-scroll-to-anchor-position.htm
<html> <head> <script type="text/javascript"> function getthere() { var position = window.frames[0].document.getelementbyid("abottom").offsettop; window.frames[0].document.body.scrolltop = position; } </script> </head> <body> <button onclick="getthere();">get me there!</button> <br/> <iframe src="loremipsum.htm" width="80%" height="510"> </iframe> </body> </html> loremipsum.htm
<html> <body> <p> lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. <br/><br/><br/><a id="abottom" style="background:red;">can see me!</a><br/><br/><br/> lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. lorem ipsum dolor sit amet, consectetur adipiscing elit. morbi tempor rutrum neque, id tincidunt dolor euismod eget. sed eget dui lectus, in scelerisque est. cras in elit leo, ut egestas ante. sed pharetra nisl quis tortor blandit ut aliquam massa euismod. donec et dictum diam. nam mollis libero eget quam dignissim eu viverra libero adipiscing. sed tempor, metus semper pellentesque rutrum, ipsum mi molestie ipsum, sed viverra libero neque et velit. fusce pulvinar erat non nisl suscipit sagittis. nam commodo purus in velit luctus congue. nam tincidunt congue eleifend. donec ut mauris quis eros ullamcorper aliquam. maecenas sit amet ligula quis lectus condimentum dictum. donec sit amet nisi ac ante pellentesque gravida. nulla interdum metus faucibus neque molestie cursus. </p> </body> </html>
Comments
Post a Comment