亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

自己寫的一個簡單但好用的滑動門jquery

發布時間:2020-06-16 13:10:07 來源:網絡 閱讀:442 作者:sunshiyi 欄目:web開發
先發html代碼:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  var $div_li=$("div.menu ul li");
  $div_li.click(function(){
      $(this).addClass("selected")
             .siblings().removeClass("selected");
  var index=$div_li.index(this);
  $("div.info>div")
  .eq(index).show(500)
  .siblings().hide(500);
  }).hover(function(){
      $(this).addClass("hover");
      },function(){
      $(this).removeClass("hover");     
          });
});
</script>
<title>滑動門</title>
<link href="style/css.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="menu">
<ul>
<li>家具</li>
<li>龍頭</li>
<li>浴室柜</li>
</ul>
</div>

<div class="info">
   <div>
   <ul>
   <li>又一個優秀的Javascrīpt框架。它是輕量級的js庫(壓縮后</li>
   <li>l,您將找到許多可以在線編輯并測試的 jQuery</li>
   <li>之后又一個優秀的Javascript框架,其宗旨</li>
   <li>列文章最后一篇,希望這些實用的插件</li>
   <li>js特效代碼大全,JS廣告代碼,導航</li>
   <li>js特效代碼大全,JS廣告代碼,導航</li>
   </ul>
   </div>
   <div class="hide">
      <ul>
   <li>主題547605個,貼子39022682篇,仙后12841縮后</li>
   <li>版街舞 達人秀驚現軟骨哥獨創軟版街舞轉貼到土</li>
   <li>淋漓盡致的一位選手,他獨創的</li>
   <li>舞曲,最好聽的dj音樂,免費dj舞曲下載,我們一直至力</li>
   <li>js特效代碼大全,JS廣告代碼,導航</li>
   <li>《布魯塞爾大廣場》,選自《世界名街》長春人名導航</li>
   </ul>
   </div>
   <div class="hide">室柜</div>
</div>

<br>



<div class="menu">
<ul>
<li>家具</li>
<li>龍頭</li>
<li>浴室柜</li>
</ul>
</div>

<div class="info">
   <div>家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具家具</div>
   <div class="hide">龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭龍頭</div>
   <div class="hide">浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室浴室柜</div>
</div>
</body>
</html>
然后建立一個在style文件夾里建立css.css文件
body{ font-size:12px;}
.menu {width:400px; height:30px;border-bottom:#999 solid 1px;}
.menu ul{ padding:0; margin:0;}
.menu ul li{ display:block; height:29px; width:80px; float:left; line-height:28px; text-align:center; list-style:none;border:#999 solid 1px; border-bottom:none;}
.info{width:398px; border-left:#999 solid 1px; border-right:#999 solid 1px; height:280px;border-bottom:#999 solid 1px;}
.info ul{ padding:0 ; margin:0; list-style:none;}
.hide{ display:none;}
.selected,.hover{ background-color:#CCC;}
 樣式不符合者可以自行修改css文件。
向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

达拉特旗| 曲水县| 德江县| 喀喇| 滁州市| 溆浦县| 长兴县| 巴林左旗| 鹰潭市| 咸宁市| 周宁县| 闻喜县| 柳林县| 湛江市| 阿鲁科尔沁旗| 龙井市| 延寿县| 宜城市| 甘孜| 安远县| 新干县| 昭觉县| 甘谷县| 广灵县| 鸡西市| 鹿泉市| 峨山| 同德县| 巧家县| 攀枝花市| 鄱阳县| 石楼县| 淮安市| 南投县| 库伦旗| 彝良县| 正安县| 青州市| 渭南市| 武鸣县| 南康市|