Home > Web Front-end > JS Tutorial > Simulated drop-down box code implemented with jQuery_jquery

Simulated drop-down box code implemented with jQuery_jquery

WBOY
Release: 2016-05-16 18:33:04
Original
1222 people have browsed it

Many group members have asked questions about the beautification of drop-down boxes. Now I will describe the production process of beautifying drop-down boxes. It is actually a simulated drop-down box.
Question 1: Why simulate a drop-down box?
1. The drop-down box style that comes with the browser is not good-looking.
2. Under IE6, the priority of the drop-down box is greater than that of the layer, which often causes the drop-down box to be displayed above the layer.
OK, after understanding this problem, we started to use jQuery to create a simulated drop-down box.

Step one: Build the structure first
This is the ordinary drop-down box code:
XML/HTML code

Copy code The code is as follows:



This is simulated:
XML/HTML code
Copy the code The code is as follows:




Option 1
< ;ul class="CRselectBoxOptions">
  • Option one< ;/li>
  • Option 2

  • Option 3

  • Option four

  • Option five

  • Option six< ;/li>



  • Related labels:
    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template