KR100697809B1 - How to make homepage using iframe - Google Patents

Abstract

The present invention relates to a method for creating a homepage using an iframe-layer, and more specifically, to place an iframe object that operates only in Microsoft's Explorer in a layer and clicks a menu to display a page of the submenu. Is read in an iframe object, and when the reading is finished, the iframe is inserted in the layer and the position, size, and display can be set so that duplicate data can be set. The purpose of the present invention is to provide a homepage production method that can prevent the movement and makes the homepage easy and accessible to the user.

Description

Iframe-how to make a homepage using layers {THE METHOD MAKING HOMEPAGE WITH IFRAME AND LAYER}

1 is a block diagram showing an example of a conventional web page screen;

2 is a block diagram illustrating components of a layer according to the present invention;

3 is a flowchart illustrating a homepage manufacturing method using an iframe-layer according to the present invention.

<Description of reference numerals for main parts of the drawings>

A: layer anchor

B: layer handle

C: layer area

The present invention locates an iframe object in a layer, which is only operated by Microsoft's Explorer, and reads the submenu's page in the iframe object when the menu is clicked. It relates to a homepage production method using an iframe-layer configured in a way that shows.

Recently, due to the rapid development of the computer industry and communication industry and the rapid spread of the Internet connection line, the number of homepages is increasing exponentially, and the promotion and sales activities of individuals and companies are very active and rapidly progressed through this.

Such a homepage is produced based on an HTML document. A typical homepage screen is configured as follows.

1 is a block diagram showing an example of a general homepage screen, 1) a page name at the top of the homepage screen 1) that defines or defines the page, and 2) having a navigation function so that a user who accesses the homepage can conveniently see it. 3) Flash to increase the aesthetics of the menu and homepage, and to dynamically display the content to appeal to the connected user.

In addition, 4) login image, affiliated homepage for membership registration and membership authentication, 5) banner image, 6) image with 7) text and homepage for advertising a specific homepage or highlighting a specific screen inside the homepage. 8) It includes the license identifying the subject.

In order to produce a homepage with the above contents, a homepage document including index.html, which is the first page, is uploaded using a Namo web editor, a Dreamweaver, a front page, and uploaded to a web server connected to the Internet.

The uploaded homepage document is displayed on the Internet to function as Internet information.

The homepage periodically updates the uploaded homepage document to reflect the latest information.

The designer of the homepage downloads the uploaded homepage document for update or reads the existing homepage document stored on his computer and edits it to add new information or change existing information.

However, in order to change the layout of the contents of a conventional homepage, for example, 2) it is necessary to reset the position, size, and color of an image or text constituting a menu, and these operations are simply performed by dragging and dropping. Inconvenient to create a table that is not visible (or visible), attach the component in the table, and specify the size and position of the component.

In other words, it takes much time to arrange and edit these elements rather than the time required to create elements such as 7) text and 6) images.

In addition, in accessing to various submenus of the uploaded homepage through such editing, the same menu structure is read and reconfigured. There was a problem that became increasingly difficult to grasp.

The present invention has been made to solve the above-mentioned problem, which is composed by inserting an iframe efficiently into the layer (layer) when creating a homepage, the main page without moving to another page or update the screen The purpose is to display the contents of a submenu on a page, thereby providing a user with the most direct interface screen.

In order to achieve the above object, the homepage manufacturing method using the iframe-layer according to the present invention,

Putting an iframe in a layer set to hidden in the main page (S100),

Inserting a script for controlling a layer and an iframe in the main page (S110);

Performing a script when the user clicks a submenu item (S120);

Passing the position and size of the layer set through the script and the page value to be displayed in the iframe (S130);

This is achieved by the step S140 of the user browsing the contents of the submenu.

Hereinafter, the present invention will be described in detail with reference to the accompanying drawings.

First, in the present invention, the iframe-layer method places an iframe object, which operates only in Microsoft's Explorer, in a layer, and when a menu is clicked, a page of a submenu is placed in an iframe (iframe-layer). iframe) reads in the object, and when it's finished reading the layer.

The iframe (iline: inline frame) is a tag that functions to allow the insertion of another HTML document in the HTML document.

The format of these iframes is <iframe name = "name" src = "address" frameborder = "border display" bordercolor = "border color" marginwidth = "width margin" marginheight = "vertical margin" width = "width Length "height =" length "align =" alignment "> </ iframe>.

In other words, name = 'name' is where you specify a name so that you can set the target of the iframe window, and src = "address" is the address of the window you want to show in the iframe window. This is where you put (path), frameborder = "border display" sets frameborder = "yes / no or 1/0" to define whether border exists or not (yes / no present: no / 0), bordercolor = "border Color "to set the color of the border.

And align = "alignment", not the alignment of the content in the frame, but the alignment of the frame with the text or images that follow it, and height / width is the width and height of the frame. Marginwidht / marginheight is where you control the margin between the document and the frame border in the frame, and scrolling = "auto / yes / no" is where you want the scrollbars to appear in the frame.

An iframe composed of this configuration has the advantage of inserting another document into the current document, but does not apply the display status and position according to the user's setting.

The layer designates an area in which various objects such as a picture, a text, and a table can be inserted on an HTML document. The layer is composed of a layer anchor (A), a layer handle (B), and a layer area (C). .

As shown in FIG. 2, the layer anchor A indicates where the layer tag is actually inserted, and the layer handle B is used to select a layer and is a handle for moving the layer. The layer area C is where the text or picture is actually inserted in the layer.

Layers are created using the layer anchors (A), the layer handles (B), and the layer area (C) .They allow you to insert multiple layers in a document. You can also overlap

You can put text or pictures in these layers, and then create animated homepages with animations, action effects, and events.

In this way, the layer can be applied to the position and display according to the user's settings, but there is a disadvantage that you can not insert another document.

In the present invention, by using the characteristics of the iframe and the layer (layer) in the present invention, the iframe object is placed in one layer, and when the menu is clicked, the page of the submenu is iframe By creating a home page by reading it in an object and displaying the layer when it is finished reading, it allows you to display the contents of the submenu on the main page without having to navigate to another page or update the screen. It can provide an interface screen.

Hereinafter, a method for manufacturing a homepage using an iframe-layer according to the present invention will be described.

First, a layer named hidden is created in the main page (S100).

Here, the hidden layer is configured using the <div> ~ </ div> tags. If the hidden layer is styled to be invisible, the hidden layer becomes a hidden layer. In other words, if you set <div style = "display: none"> <iframe> </ iframe> </ div>, the contents of the layer (iframe) will not be visible.

Subsequently, an iframe is placed in a layer set to hidden in the main page (S110).

This is an example of an iframe format of <Iframe name = "HIDDEN" FRAMEBORDER = 0, SCROLLING = NO, SRC = "./ inc / blank.htm", width = 0, height = 0, border = 0> Is done.

Subsequently, a script for controlling a layer and an iframe is put in the main page (S120).

These scripts appear when you perform an event on a specific part of the main screen, and the execution of that event executes a JavaScript function.

Here, an event refers to all the actions that a user takes on the browser, and here it refers to the action of clicking a specific object (submenu) with the mouse.

The function structure of JavaScript is as follows.

<script>

function layer1_on (url, pos_x, pos_y, size_x, size_y)

layer1.style.left = pos_x;

layer1.style.top = pos_y;

layer1.style.width = size_x + 16;

layer1.style.height = size_y + 16;

table1.height = size_y +46;

table2.height = size_y +43;

table3.width = size_x;

table4.width = size_x;

if (layer1_page! = url)

frame1.location.href = url;

document.getElementById ('ifrm1'). width = size_x;

document.getElementById ('ifrm1'). height = size_y;

layer1.style.display = '';

layer1_page = url;

layer1_status = 1;

</ script>

This script is designed for page names, X coordinates, Y coordinates,

It is executed by taking arguments, and when done as set,

layer1.style.display = '';

The layer is shown as follows.

Subsequently, when the user clicks the lower menu item, the script is executed (S130).

This is a method of entering a submenu item. The image is largely clicked, the text is clicked, and the like is configured as follows.

<imgsrc = "./ link1.jpg" onClick = "layer1_on ('./ link1.htm', '120', '100', '400', 300 ')";>

Let's execute JavaScript on the image click event.

The text is constructed as follows.

<span onClick = "layer1_on ('./ link1.htm', '120', '100', '400', 300 ')";> link1 </ span>

Let's execute JavaScript on the letter click event.

Subsequently, the script passes the position and size of the layer and the page value to be displayed in the iframe.

When layer1_on ('./ link1.htm', '120', '100', '400', 300 ') is performed,

The function of layer1_on is executed and executed in the following manner.

Change the horizontal position of the layer from the second parameter '120'

Change the vertical position of the layer from the third parameter "100"

Change the horizontal size of the layer from the fourth parameter "400"

Change the vertical size of the layer from the fifth parameter "300"

Update to the specified document if the current iframe and the specified document are different

This will show the documentation of the layer.

Subsequently, the user browses the contents of the submenu (S140).

This will allow you to browse the submenu pages once the script has finished running.

In this way, the homepage can be created by placing an iframe object in a layer, reading a page of the submenu in an iframe object when the menu is clicked, and displaying the layer after reading.

As described above, in the present invention, by updating the content in real time, the content can be updated at a higher speed than when relying on outsourcing, and the homepage is easy because there is no need to reload many of the overlapping components in the submenu. It has the effect of improving the user's accessibility.

Claims (3)

Putting an iframe in a layer set to hidden in the main page (S100), Inserting a script for controlling a layer and an iframe in the main page (S110); Performing a script when the user clicks a submenu item (S120); Passing the position and size of the layer set through the script and the page value to be displayed in the iframe (S130); Method of producing a homepage using an iframe-layer, characterized in that the user consists of viewing the contents of the submenu (S140). The method of claim 1, wherein the hidden layer is configured using <div> ~ </ div> tags. The method of claim 1, wherein the script appears when performing an event on a specific part of the main screen, and a function of JavaScript is executed by performing the event. .

Images