jquery는 선택 드롭다운 상자 미화 특수 효과 코드를 구현합니다.-JS 튜토리얼-php.cn

jquery는 선택 드롭다운 상자 미화 특수 효과 코드를 구현합니다.

PHPz

풀어 주다： 2018-09-29 10:55:19

앞으로

1711명이 탐색했습니다.

이 글은 선택 드롭다운 상자를 아름답게 하기 위한 jquery 구현을 주로 소개합니다. 효과가 간단하고 우아해 도움이 필요한 모든 사람에게 권장됩니다.

선택 드롭다운 상자 미화를 구현하기 위한 jquery 기반의 특수 효과 코드입니다. 사용자가 드롭다운 메뉴의 내용을 선택할 수 있는 매우 실용적인 특수 효과 소스 코드입니다.

모든 사람과 공유되는 선택 드롭다운 상자 미화 특수 효과 코드의 jquery 구현은 다음과 같습니다.

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/g.css" type="text/css" rel="stylesheet" />
<link href="css/css.css" type="text/css" rel="stylesheet" />
</head>
<body>
<p class="searchbox">
 <p class="searchZone clearfix">
 <form target="_blank">
 <fieldset>
 <label>
 <input type="text" class="text" name="keyword" onblur="if(this.value==&#39;&#39;){this.value=&#39;请输入关键字&#39;;this.style.color=&#39;#aaa&#39;}" onfocus="if(this.value==&#39;请输入关键字&#39;){this.value=&#39;&#39;;this.style.color=&#39;#333&#39;}" value="请输入关键字" />
 </label>
 <p class="left">
 <select style="display: none;" name="mySle" id="mySle">
 <option selected="selected" value="0">全站搜索</option>
 <option value="1">素材搜索</option>
 <option value="2">设计欣赏</option>
 <option value="3">桌面壁纸</option>
 <option value="4">设计教程</option>
 </select>
 </p>
 <label>
 <button type="submit">快给我搜一下</button>
 </label>
 </fieldset>
 </form>
 <script type="text/javascript" src="js/jquery.js"></script>
 <script type="text/javascript" src="js/selectbox.js"></script>
 <script type="text/javascript"> $(document).ready(function() {$(&#39;#mySle&#39;).selectbox();});</script>
 </p>
</p>
</body>
</html>

로그인 후 복사

렌더링 실행: