Use an IFRAME to invoke a specific location of the specified Web page (display the content I want for an area of the destination page)

Source: Internet
Author: User

Use an IFRAME to invoke a specific location of the specified Web page (display the content I want for an area of the destination page)

There are times when we don't need to display all the contents of the target page specified by the iframe tag attribute src, often only need to display a specific area. There are two implementations available, but it is strictly forbidden to use this method for deception and concealment purposes.

Here are some of the properties of the IFRAME, a little introduction:
1. The marginheight attribute specifies the height, in pixels, between the frame content and the top and bottom of the frame.
2. The Maiginweidth attribute specifies the height, in pixels, between the frame content and the left and right sides of the frame.
3. Vspace the area shown in the Y-direction, negative value is the part that starts at the top of the target page, positive values are Y + + start content area from top
4. Hsapce the area displayed in the x direction, negative value is the part starting from the left side of the target page, with a positive value of X + + from the left to the area
5. SRC Destination webpage address, can be html,asp, text etc. within such as
6. Frameborder frame border, 0 no border (Pip effect)
7. Scrolling whether the scroll is displayed, yes display
8. Align: Specifies the position of the page within the floating window relative to the floating window, with a value of left, right, top, middle, bottom
9. Marginwidth, Marginheight target page is covered by the depth of the frame

Method One, Baidu homepage http://www.baidu.com For example, remove the logo part of Baidu, code and Effect are as follows:

< html>
< head>
<title>iframe label displays the specified area of the destination page, method 1</title>
< body>
< div align= "center" >
< iframe width= "height=" src= "http://www.baidu.com" scrolling= "no" hspace= " -100" vspace= " -150" ></ Iframe>
</div></body>

Method two, using Div control, is also the benefit of using the IFRAME framework, because it is not like frame, it can display any area code for the page as follows:
< html>
< head>
<title>iframe label displays the specified area of the destination page, method 1</title>
< body>
< div align= "center" style= "margin:0 auto;" >

<div style= "width:800px;height:600px;overflow:hidden;border:0px" >
<div style= "width:500px;height:800px;margin:-153px 0px 0px-10px;" >
<iframe src= "http://www.baidu.com" width= "$" height= "all" scrolling= "no" >
</iFrame>
</div>
</div>
</div>
</body>

Method Three,

At present, there is no way to control by the coordinates, only by the top, left and right running method to control, so to make a file to fully invoke the target page content, and then the need to invoke the specified content where the IFRAME code call.
First set up a full call to the target Web page file, named files.html, the code is as follows:

< head>
< meta http-equiv= "Content-type" content= "text/html; Charset=gb2312″>
<title>AUDCNY</title>
< body> <iframe src= "Destination url" width= "980″height=" 700″frameborder= "0″scrolling=" no "style=" position:absolute; Top: -120px; Left: -680px; " ></iframe>
</body>
This page uses the IFRAME framework to reference the target page, and uses CSS positioning to set the frame floating position (top: -120px; Left: -680px). Of course, you can also control the right margin, such as right:680px, the distance size can be adjusted according to the situation until the adjustment to the appropriate position.

Then put the following code in the appropriate location in the file where you want to invoke the target content:

<iframe src= "Fill in the address of the above saved HTML document" Width= "300″height=" 230″frameborder= "0″scrolling=" no "></iframe>
Aspect can be adjusted according to the situation, in order to make the contents of the call normal, correct display of our position, you can modify the files.html in the margin control to achieve the best results.

Problem encountered:add vspace=-190 hspace=0 in the iframe table in JSP undefined attribute name (vspace) error. And neither of these tags work.

 
First provide a div that needs the current position size and then introduce the page to be loaded in this div and specify where to view the content, here is an example you can refer to, if you do not understand to ask me.
<div class= "Groupnews_insidel" style= "width:800px;margin-left:10px; overflow:hidden;position:relative; " >
<iframe id= "Jin10" width= "125%" height= "" "frameborder=" 0 "style=" position:relative "; top:-175px; Float:left; left:-193px; "scrolling=" No "src=" http://www.kuaixun360.com/data/2.html "name=" Jin10 ">
<! DOCTYPE html>
</iframe>
</div>

Use an IFRAME to invoke a specific location of the specified Web page (display the content I want for an area of the destination page)

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.