introduction
Due to more and more companies began to build their own websites, the website often represents the image of the company in addition to the function of dissemination. The trend of websites construction and advertising will put higher requirements for web design. Although the HTML language provides support for common Windows standard controls, because the shape and color of the Windows standard control are very single, the visual effect of the web page may be poor. For example: The list box and drop-down list box can only present the concave border, and the color of the arrow of the drop-down list cannot change, the scroll bar can only appear on the bottom and right side of the window, when the web page is divided into multiple frames, the scroll bar is inevitable The appearance of the web page, destroying the integrity of the web page. If you actively cooperate with the shape and color of the Windows Standard Control in the design of the web page, the creation space of the web page will be restricted. Therefore, it is necessary to achieve custom controls in the web page to meet web design and artistic requirements.
Programming principle
Use the client's JavaScript scripting language, programming the
The tag defines a line interval in the HTML document, you can assign an ID attribute to this interval, give the entire interval, such as a unified color, font, border, background, etc., so that the entire interval should be the same event. You can use this tag to make menu, tree structure directory, list box, and drop-down list box. Multiple tags can be placed in the same row, which make up the menu bar of the drop-down menu.
The
List box and drop-down list box
Place a group of tags in a Place a tag in the web page as the drop-down list box. Place another tag, set this tag, set this tag to form a drop-down arrow. Place a list box made by the drop-down list box as a drop-down list, set the style.display property of the drop-down list to None, then display or hide the list according to the mouse action. Write a list item's onclick event handler, place the selected item text in the drop-down list box. Pop-up menu Since the web page cannot respond to the right mouse button, the pop-up menu can only be implemented with the Click event with the left mouse button. Follow the list of design methods to design the pop-up menu to set the style.display property of the pop-up menu Drop-down menu Make a menu bar with a tag, the menu section tag is embedded Set Several tags as submenu. Design a drop-down menu for each sub-menu according to the design method of the pop-up menu. Show or hide the drop-down menu by a mouse event in response to the submenu. To make it easy to transplant, you can place menu data in an array and dynamically generate a menu in the program's Write method through the Document object. scroll bar Place a The size and location of the various components of the scroll bar is changed according to the size of the window and the web page in the LOAD event and Resize event of the Window object. Place a The rolling strips implemented by the above method can be designed to be designed to be placed in any location of the web page, select any picture as the background of the arrow and the slider, which greatly meets the requirements of the artistic design web page. This article uses the style properties of HTML tag and
tag, form a list box. Add events to the tag to change the color according to the position of the mouse. In the tag, the specified operation is completed or the INNERTEXT or ID attribute of the selected item is stored in the hidden control or variable in order to retrieve the selected item.
