91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

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

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

自己寫的一個簡單但好用的滑動門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

溧水县| 灵山县| 衡水市| 香河县| 临安市| 肇东市| 哈尔滨市| 康保县| 华亭县| 鹤壁市| 定兴县| 水富县| 黄浦区| 绥江县| 山东| 綦江县| 承德市| 淅川县| 乃东县| 阳泉市| 苏尼特右旗| 深州市| 望江县| 邹平县| 新密市| 临朐县| 凯里市| 色达县| 襄樊市| 余姚市| 台北市| 浏阳市| 绥化市| 泸定县| 宁津县| 安新县| 县级市| 岑溪市| 左权县| 龙里县| 赤峰市|