How to control the scrolling of a frames page

Source: Internet
Author: User
Tags array join setinterval variable domain
Control

How to control the scrolling of a frames page

Solution Idea:

Scrolls using the Scrollby method of the Window object in the frame document.

Specific steps:

1. Code that contains the frames page.

<script>
var itv,stepx,stepy,obj
function Scrollstart (x,y) {
Stepx=x the offset on the direction of the//x axis
Stepy=y the offset on the direction of the//y axis
Obj=document.frames.demo//Capture frame objects
Set interval events to scroll once per 10 milliseconds with stepx and stepy offsets
Itv=setinterval ("Obj.scrollby (stepx,stepy)", 10)
}
function Scrollstop () {
Clearinterval (ITV)//Cancel interval event to achieve stop scrolling effect
}
</script>
<iframe frameborder= "0" scrolling= "no" name= "demo"
Src= "Demo.htm" ></iframe>
<button

</button> on >
<button

> Under </button>
<button

> Left </button>
<button

> Right </button>

2.demo.htm page code. This is just for testing purposes and can be replaced with your own page.

<script>
In order to produce a horizontal scroll bar
document.write (New Array. Join ("1"))
In order to produce a longitudinal scroll bar
document.write (New Array (). Join ("1<br>")
</script>

Note: If the page loaded by the IFRAME is an outbound URL, it will cause a cross-domain problem and deny access. When it comes to accessing and controlling a frames page, there are cross-domain problems.

Special Tips

The effect after the code is run is as shown in Figure 1.6.8. Move the mouse over the four buttons, the page loaded within the IFRAME will scroll up, down, left and right four sides, in the press mouse when scrolling faster, release the mouse (still on the button) when the recovery speed, the mouse moved away after scrolling stop.

1.6.8 controls the scrolling of the IFRAME

Special Notes

This example is mainly the application of the Scrollby method of Window objects. By setting the horizontal rolling speed stepx and the longitudinal rolling speed stepy as the global variable, in the function when the mouse moves the SetInterval calls the Scrollby method to scroll the page continuously, through the parameter control scroll direction, when the mouse presses, enlarges the global variable stepx or the Stepy value , people to speed up the effect of scrolling, and the mouse to move away and then use the Clearinterval method to clear the previous SetInterval event to stop scrolling.

Scrollby the window to scroll the x and y offsets.

SetInterval evaluates an expression after each specified millisecond value.

Clearinterval uses the SetInterval method to cancel a previously started interval event.



Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.