仿淘寶首頁商品分類列表效果 -- [表格特效]─ 深山工作室提供網絡投票系統|微信公眾號投票|微信公眾號小程序|抖音小程序|百度小程序|微信公眾號開發|企業網站建設

<thead id="jxdzp"><address id="jxdzp"><pre id="jxdzp"></pre></address></thead>

<em id="jxdzp"><span id="jxdzp"></span></em>

<listing id="jxdzp"><nobr id="jxdzp"><meter id="jxdzp"></meter></nobr></listing>

<address id="jxdzp"></address>

<noframes id="jxdzp"><form id="jxdzp"><th id="jxdzp"></th></form>

<noframes id="jxdzp"><form id="jxdzp"><th id="jxdzp"></th></form>

訂閱本欄目 RSS您所在的位置: 深山工作室 > 表格特效 > 正文

仿淘寶首頁商品分類列表效果

網絡 2009/6/17 15:05:09 深山行者字體:大中小瀏覽 8186

以下為詳細代碼

<!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=gb2312" />
<title>仿淘寶首頁商品分類列表效果</title>
<style type="text/css">
<!--
body {
    font-size: 12px;
}

#shone1,#shtwo1 {
    text-align: center;
    padding: 9px;
}
.huixuxian {
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: #CCCCCC;
}
.huixuxian ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}
.huixuxian li {
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 2px;
    margin-bottom: 2px;
    background-color: #F3F3F3;
}
.huixuxian li.hover {
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #FF0000;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 2px;
    margin-bottom: 2px;
    border-top-width: 2px;
    border-left-width: 2px;
    border-top-style: solid;
    border-left-style: solid;
    border-top-color: #FF0000;
    border-left-color: #FF0000;
    background-color: #FFFFFF;
}
#apDiv1,#apDiv4 {
    position:absolute;
    z-index:3;
    visibility: hidden;
}

#apDiv3,#apDiv6 {
    position:absolute;
    z-index:2;
    border: 2px solid #FF0000;
    visibility: hidden;
    background-color: #FFFFFF;
    margin-top: 2px;
    margin-left: 0px;
}

-->
</style>

<script type="text/javascript">
<!--
function setOver(name,cursel,n){
 for(i=1;i<=n;i++){
 var menu=document.getElementById(name+i);
 menu.className=i==cursel?"hover":"";
 }
}

function setOut(name,cursel,n){
 for(i=1;i<=n;i++){
 var menu=document.getElementById(name+i);
 menu.className=i==cursel?"":"hover";
 }
}

function MM_showHideLayers() { //v9.0
 var i,p,v,obj,args=MM_showHideLayers.arguments;
 for (i=0; i<(args.length-2); i+=3) 
 with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
  if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
  obj.visibility=v; }
}
//-->
</script>

</head>

<body>
<table width="700" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td width="64" class="huixuxian">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
    <td width="7%">
    <div id="apDiv1">
    <ul>
        <li id="shone1" onmouseover="setOver('shone',1,1);MM_showHideLayers('apDiv1','','show','apDiv2','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
         數<br />碼<br /><br /></li>
    </ul>
    </div>
    <ul>
        <li id="shone1" onmouseover="setOver('shone',1,1);MM_showHideLayers('apDiv1','','show','apDiv2','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
         數<br />碼<br /><br /></li>
    </ul>
    </td>
    <td width="93%" valign="top">
    
    <div id="apDiv3" onmouseover="setOver('shone',1,1);MM_showHideLayers('apDiv1','','show','apDiv2','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
    <table width="674" border="0" cellspacing="0" cellpadding="3">
     <tr>
      <td width="651">sss新浪基金為全球用戶24小時提供全面及時的基金中文資訊，內容涵蓋基金行業動態、基金 凈值、基金排名、基金數據、基金評級、基金知識、基金論壇、基金超市和基金聯盟等</td>
     </tr>
     <tr>
      <td>擁有豐富的新聞資訊及評論，詳實的數據資料，專業的評級系統，活躍的基金經理沙龍， 火爆的論壇和博客，為您提供最優質的服務平臺，是您貼心的理財參謀</td>
     </tr>
     <tr>
      <td width="651">新浪基金為全球用戶24小時提供全面及時的基金中文資訊，內容涵蓋基金行業動態、基金 凈值、基金排名、基金數據、基金評級、基金知識、基金論壇、基金超市和基金聯盟等</td>
     </tr>
     <tr>
      <td>擁有豐富的新聞資訊及評論，詳實的數據資料，專業的評級系統，活躍的基金經理沙龍， 火爆的論壇和博客，為您提供最優質的服務平臺，是您貼心的理財參謀</td>
     </tr>
    </table>
    </div>    
    <div id="apDiv2">
    <table width="674" border="0" cellspacing="0" cellpadding="3" onmouseover="setOver('shone',1,1);MM_showHideLayers('apDiv1','','show','apDiv2','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
     <tr>
      <td width="651">新浪基金為全球用戶24小時提供全面及時的基金中文資訊，內容涵蓋基金行業動態、基金 凈值、基金排名、基金數據、基金評級、基金知識、基金論壇、基金超市和基金聯盟等</td>
     </tr>
     <tr>
      <td>擁有豐富的新聞資訊及評論，詳實的數據資料，專業的評級系統，活躍的基金經理沙龍， 火爆的論壇和博客，為您提供最優質的服務平臺，是您貼心的理財參謀</td>
     </tr>
    </table>
    </div>
    </td>
   </tr>
  </table>  </td>
 </tr>
 
 <tr>
  <td class="huixuxian">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
    <td width="7%">
    <div id="apDiv4">
    <ul>
        <li id="shtwo1" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
         服<br />裝<br /><br /></li>
    </ul>
    </div>
    <ul>
        <li id="shtwo1" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
         服<br />裝<br /><br /></li>
    </ul>
    </td>
    <td width="93%" valign="top">
    
    <div id="apDiv6" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
    <table width="674" border="0" cellspacing="0" cellpadding="3">
     <tr>
      <td width="651">太平洋女性網服飾頻道提供海量時尚服飾資訊,服裝新品上市一手資料,教你各類服裝搭配的方案,打造屬于你自己的魔鬼身材，完美身材</td>
     </tr>
     <tr>
      <td>服裝品牌,服裝品牌排行榜,服裝品牌大全,服裝品牌排行榜__買服裝先上品牌世家網. ... 戴菲菲為代言安踏女子時尚系列服裝拍攝寫真精美圖</td>
     </tr>
     <tr>
      <td width="651">太平洋女性網服飾頻道提供海量時尚服飾資訊,服裝新品上市一手資料,教你各類服裝搭配的方案,打造屬于你自己的魔鬼身材，完美身材</td>
     </tr>
     <tr>
      <td>服裝品牌,服裝品牌排行榜,服裝品牌大全,服裝品牌排行榜__買服裝先上品牌世家網. ... 戴菲菲為代言安踏女子時尚系列服裝拍攝寫真精美圖</td>
     </tr>
     <tr>
      <td width="651">太平洋女性網服飾頻道提供海量時尚服飾資訊,服裝新品上市一手資料,教你各類服裝搭配的方案,打造屬于你自己的魔鬼身材，完美身材</td>
     </tr>
    </table>
    </div>    
    <div id="apDiv5">
    <table width="674" border="0" cellspacing="0" cellpadding="3" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('apDiv1','','hide','apDiv2','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
     <tr>
      <td width="651">太平洋女性網服飾頻道提供海量時尚服飾資訊,服裝新品上市一手資料,教你各類服裝搭配的方案,打造屬于你自己的魔鬼身材，完美身材</td>
     </tr>
     <tr>
      <td>服裝品牌,服裝品牌排行榜,服裝品牌大全,服裝品牌排行榜__買服裝先上品牌世家網. ... 戴菲菲為代言安踏女子時尚系列服裝拍攝寫真精美圖</td>
     </tr>
    </table>
    </div>    </td>
   </tr>
  </table>  </td>
 </tr>
</table>
</body>
</html>

前一頁:可以用作后臺的超級強的變色表格

后一頁:表格增加

相關閱讀: python加Appium判斷滑動是否到達屏幕底部; 屏幕兩種色彩左右像電影屏幕一樣分開; 一個可以說是超級變態,超級強的DIV+CSS應用; 01. windows xp 安裝iis視頻教程; 四川省中國青年旅行社有限公司高新分社; httpd.ini中的RewriteRule、RewriteCond規則了解以有二級域名解析實例; 巧妙運用CSS樣式表立刻改變鼠標的樣式; 利用background-color:#000000a8在背景顏色16進制代碼之后加字母加上數字讓背景色透明

共有0條關于《仿淘寶首頁商品分類列表效果》的評論: 發表評論

正在加載評論......

返回頂部發表評論

呢稱:
表情:
內容:	評論內容:不能超過 1000 字,需審核,請自覺遵守互聯網相關政策法規。
驗證碼:

網友評論聲明,請自覺遵守互聯網相關政策法規。

您發布的評論即表示同意遵守以下條款:
一、不得利用本站危害國家安全、泄露國家秘密,不得侵犯國家、社會、集體和公民的合法權益;
二、不得發布國家法律、法規明令禁止的內容;互相尊重,對自己在本站的言論和行為負責;
三、本站對您所發布內容擁有處置權。

更多信息>>欄目類別選擇: 百度小程序開發; 微信小程序開發; 微信公眾號開發; uni-app; asp函數庫; ASP; DIV+CSS; HTML; python

更多>>同類信息: 用javscript實現為表格的每一行自動加上序號; 鼠標放在表格區域內，當前格的一整行和一整列變色; 鼠標經過表格列時變色; javascript表格內移動上下列，可以做成ajax加上動態程序做成上下移動順序; 利用javascript鼠標經過表格，行與列變色; 針對table,div隔行變色的JS方法

更多>>最新添加文章: dw里面查找替換使用正則刪除sqlserver里面的CONSTRAINT; Android移動端自動化測試：使用UIAutomatorViewer與Selenium定位元素; 抖音直播音掛載小雪花懂車帝小程序; javascript獲取瀏覽器指紋可以用來做投票; 火狐Mozilla Firefox出現：無法載入您的Firefox配置文件它可能已經丟失或是無法訪問問題解決集合處理辦法; 在Android、iOS、Windows、MacOS中微信小程序的文件存放路徑; python通過代碼修改pip下載源讓下載庫飛起; python里面requests.post返回的res.text還有其它的嗎

更多>>隨機抽取信息: 防止點擊空鏈接時，頁面往往重置到頁首端; 2012-3-22中午的一件電話事件(一個不懂怎么定義的電話)(備份); windows7環境下安裝配置jdk; 山西省太原夏日陽光國際旅行社; 國內網站常用的一些 CDN 靜態資源公共庫加速服務; 對MD5加密方式使用者的建議

更多標簽熱門標簽

height 生成強聊十字查找翻滾模式 DropShadow csss 告字母左右全 input 緩沖 getElementById 文化淘寶 JavaScript實現文本框提示效果高亮過濾 id 2.0 文件復制 ResponseXML rnd 游戲濾鏡復選框絕對定位文件夾添加 checkbox 插件 confirm 適應選項導出廣告 2003 img 參數右鍵失效路徑 dw 訪問量跳轉 asp.net 行號二級 CSS濾鏡正則

行業解決方案: 抖音小程序百度小程序微信小程序

了解我們: 關于深山; 業務范圍; 案例展示中心; 聯系我們; 網站地圖; 贊助深山

動態展示: 定制網絡投票系統; 定制小程序

服務熱線: 13961347334

: 微信公眾號二維碼

: 百度小程序二維碼

: 頭條抖音小程序二維碼

: 聯系微信二維碼

: 聯系QQ二維碼

免責聲明:本站所有資料信息,有部分為本人原創,部分為從網絡收集而來,僅供網友查看閱讀所用,所有信息版權歸信息所有人或所有公司所有
如果信息內容侵犯到您的版權或權益請與我們聯系,經確認后我們會立即移除相關內容或鏈接
Copyright © 2007-2025 深山工作室 All Rights Reserved
服務QQ:565449214 手機:13961347334
ICP備案:蘇ICP備15019627號

蘇公網安備 32070502010230號

88国产精品视频一区二区三区