jquery點擊左側菜單右側推送彈出內容顯示效果代碼



164 655 219



特效描述:點擊左側菜單 右側推送彈出 彈出內容顯示,大氣簡潔,自己從別地方整理出來的感覺不錯的效果,共享給各位

代碼結構

1. 引入CSS

<link href="css/index.css" rel="stylesheet" type="text/css">

2. 引入JS

<script src="js/jquery-1.js"></script>
<script src="js/js.js"></script>

3. HTML代碼

<div id="index_all">
    <div id="index_left">    
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody><tr>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="180">
            <tbody><tr>
              <td width="210"><!--<img src="images/en.jpg" height="17" width="50"> <img src="images/zw.jpg" height="17" width="51">--></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="180">
            <tbody><tr>
              <td width="210"><a href="/"><!--<img src="images/logo.jpg" height="54" width="153">--></a></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="40">&nbsp;</td>
        </tr>
        <tr>
          <td>
          	<div class="index_menu">
            <ul>
            <li><a href="/"><div>導航菜單</div></a></li>
            <li><a href="/"><div>導航菜單</div></a></li>
            <li><a href="/"><div>導航菜單</div></a></li>
            <li><a href="/"><div>導航菜單</div></a></li>
            <li><a href=""><div>導航菜單</div></a></li>
            <li style=" border-bottom:solid #191B1A 1px;"><a href=""><div>導航菜單</div></a></li>
            </ul>
            </div>
          </td>
        </tr>
        <tr>
          <td>
            <script>
          	$().ready(function(e) {
                $(".ny_menu").show(100);
				<!--鼠標移上后高亮顯示菜單-->
				$(".dmenu").mouseover(function(){ 
					$(this).addClass("liang_menu");
				})
				$(".dmenu").mouseout(function(){ 
					$(this).removeClass("liang_menu");
				})
				<!--點擊資本按鈕時-->
				$("#zb_bu").click(function(){ 
					$(".hide_d").hide(); //所有子菜單隱藏
					$(".dmenu").removeClass("liang_menu1"); //所有子菜單去紅色高亮背景
					$(this).find(".dmenu").addClass("liang_menu1"); //當前子菜單加紅色高亮背景
					$("#zb_menu").show(500); // 顯示下級菜單
					$("#mid_body").animate({ "margin-left": '-370px' }, "50"); //中間向左移動
					//右側內容變為資本的
					$("#index_r_body").hide();
					$("#zc_r_body").hide();
					$("#jz_r_body").hide();
					$("#zb_r_body").show();
					$(".qm_right").hide(); //當前按鈕隱藏
					$(".qm_left").show(); //向右按鈕顯示
					$("#index_right").animate({ left: '580px' }, "50"); //如果大圖在左邊向右移動
				})
				<!--點擊資產按鈕時-->
				$("#zc_bu").click(function(){ 
					$(".hide_d").hide();  //所有子菜單隱藏
					$(".dmenu").removeClass("liang_menu1"); //所有子菜單去紅色高亮背景
					$(this).find(".dmenu").addClass("liang_menu1"); //當前子菜單加紅色高亮背景
					$("#zc_menu").show(500); // 顯示下級菜單
					$("#mid_body").animate({ "margin-left": '-740px' }, "50"); //向左移動
					//右側內容變為資本的
					$("#index_r_body").hide();
					$("#zb_r_body").hide();
					$("#jz_r_body").hide();
					$("#zc_r_body").show();
					$(".qm_right").hide(); //當前按鈕隱藏
					$(".qm_left").show(); //向右按鈕顯示
					$("#index_right").animate({ left: '580px' }, "50"); //如果大圖在左邊向右移動
				})
				<!--點擊建設按鈕時-->
				$("#jz_bu").click(function(){ 
					$(".hide_d").hide();  //所有子菜單隱藏
					$(".dmenu").removeClass("liang_menu1"); //所有子菜單去紅色高亮背景
					$(this).find(".dmenu").addClass("liang_menu1"); //當前子菜單加紅色高亮背景
					$("#jz_menu").show(500); // 顯示下級菜單
					$("#mid_body").animate({ "margin-left": '-1110px' }, "50"); //向左移動
					//右側內容變為資本的
					$("#index_r_body").hide();
					$("#zb_r_body").hide();
					$("#zc_r_body").hide();
					$("#jz_r_body").show();
					$(".qm_right").hide(); //當前按鈕隱藏
					$(".qm_left").show(); //向右按鈕顯示
					$("#index_right").animate({ left: '580px' }, "50"); //如果大圖在左邊向右移動
				})
				<!--點擊建設按鈕時-->
				<!--顯示資本子菜單-->
				<!--顯示資產子菜單-->
				<!--顯示建筑子菜單-->
				            });
          </script>
          	<div class="ny_menux">
            <ul>
            	<li id="zb_bu"><a href="javascript:void(0);"><div class="dmenu">二級導航菜單</div></a>
                <div id="zb_menu" class="hide_d"><ul>
                    	<li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                 </ul></div></li>
              <li id="zc_bu"><a href="javascript:void(0);"><div class="dmenu">二級導航菜單</div></a>
                <div id="zc_menu" class="hide_d"><ul>
                    	<li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                    </ul></div></li>
                <li id="jz_bu"><a href="javascript:void(0);"><div class="dmenu ">二級導航菜單</div></a>
                <div id="jz_menu" class="hide_d"><ul>
                    	<li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                        <li><a href="/"><div>導航菜單3</div></a></li>
                    </ul></div></li>
            </ul>
            </div>
          </td>
        </tr>
      </tbody></table>
    </div>
<div id="mid_use">  
    <div id="mid_body">
    <!--首頁中間位置-->
    <div id="index_mid">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody><tr>
          <td><img src="images/20140105134447204138.jpg" height="502" width="370"></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td height="20"><table border="0" cellpadding="0" cellspacing="0" width="370">
            <tbody><tr>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140708103527950408.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">地產公開課南京站開講</a></div>
                </td></tr>
              </tbody></table>
              </td>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140703092842590483.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">開課將于7月5日啟動</a></div>
                </td></tr>
              </tbody></table>
              </td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="70"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="0" align="center" width="342">
                        <tbody><tr>
              <td align="left" width="370"><a href="." class="sh_12">[2014-06-16]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">聰:大虹橋核心商務區開發是一個有差異性的...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-06-16]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">《地產產管理董事兼聯席總裁:儒商...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-31]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">慶六一“快樂探索小世界”活動...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                      </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="1" align="center" bgcolor="#959595" width="342">
            <tbody><tr>
              <td align="left" bgcolor="#FFFFFF" height="25" width="370"><a href="/" class="sh_12"> 更多&gt;&gt;</a></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
      </tbody></table>
    </div>
    <!--資本中間位置-->
    <div id="zb_mid">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody><tr>
          <td><img src="images/20131125142345910627.jpg" height="502" width="370"></td>
        </tr>
        <tr>
          <td height="20"><table border="0" cellpadding="0" cellspacing="0" width="370">
            <tbody><tr>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140708103527950408.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">業地產公開課南京站開講</a></div>
                </td></tr>
              </tbody></table>
              </td>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140703092842590483.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">地產公開課將于7月5日啟動</a></div>
                </td></tr>
              </tbody></table>
              </td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="70"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="0" align="center" width="342">
                        <tbody><tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-31]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">慶六一“快樂探索小世界”活動...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-29]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">座《購物中心的設計與產品要點》成功舉行...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-14]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">高棟:武漢大躍進“痛并快樂著”...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                      </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="1" align="center" bgcolor="#959595" width="342">
            <tbody><tr>
              <td align="left" bgcolor="#FFFFFF" height="25" width="370"><a href="/" class="sh_12"> 更多&gt;&gt;</a></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
      </tbody></table>
    </div>
    <!--資產中間位置-->
    <div id="zc_mid">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody><tr>
          <td><img src="images/20131125142311184035.jpg" height="502" width="370"></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td height="20"><table border="0" cellpadding="0" cellspacing="0" width="370">
            <tbody><tr>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140708103527950408.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="h/" class="sh_12">是人的合法身份感受到個</a></div>
                </td></tr>
              </tbody></table>
              </td>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140703092842590483.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">是人的合法身份感受到個7月5日啟動</a></div>
                </td></tr>
              </tbody></table>
              </td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="70"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="0" align="center" width="342">
                        <tbody><tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-06-16]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">《地產品》是人的合法身份感受到個:儒商...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-31]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">是人的合法身份感受到個“是人的合法身份感受到個”活動...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-05-29]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">是人的合法身份感受到個SPS專題講座《購物中心的設計與產品要點》成功舉行...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                      </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="1" align="center" bgcolor="#959595" width="342">
            <tbody><tr>
              <td align="left" bgcolor="#FFFFFF" height="25" width="370"><a href="/" class="sh_12"> 更多&gt;&gt;</a></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
      </tbody></table>
    </div>
    <!--建設設計中間位置-->
    <div id="jz_mid">
      <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tbody><tr>
          <td><img src="images/20131231141044870660.jpg" height="502" width="370"></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td height="20"><table border="0" cellpadding="0" cellspacing="0" width="370">
            <tbody><tr>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140430103415991891.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">是人的合法身份感受到個:增加兒童業態 是否...</a></div>
                </td></tr>
              </tbody></table>
              </td>
                          <td align="center">
              <table border="0" cellpadding="0" cellspacing="0" width="160">
	            <tbody><tr><td height="135" width="185">
	            <a href="/" class="sh_12">
	            <img src="images/20140421134329239732.jpg" height="135" width="185"></a></td></tr>
                <tr><td class="sh_12" height="10"></td></tr>
                <tr><td align="left" height="40" valign="top" width="185">
                <div style="margin:0px 5px;"><a href="/" class="sh_12">“是人的合法身份感受到個365商業考察團上海之旅”圓滿結束...</a></div>
                </td></tr>
              </tbody></table>
              </td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="70"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="0" align="center" width="342">
                        <tbody><tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-04-11]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">是人的合法身份感受到個“第七屆中國商業地產發展高峰論壇”...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-04-09]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">佛擋殺佛“優秀商業設計...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                        <tr>
              <td align="left" width="370"><a href="/" class="sh_12">[2014-03-31]</a></td>
            </tr>
            <tr>
              <td align="left"><a href="/" class="sh_12">是人的合法身份感受到個“微門戶”正式上線:“等你來敲門”!...</a></td>
            </tr>
            <tr>
              <td align="left" height="5"></td>
            </tr>
                      </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
        <tr>
          <td align="center" height="20"><table border="0" cellpadding="0" cellspacing="1" align="center" bgcolor="#959595" width="342">
            <tbody><tr>
              <td align="left" bgcolor="#FFFFFF" height="25" width="370"><a href="/" class="sh_12"> 更多&gt;&gt;</a></td>
            </tr>
          </tbody></table></td>
        </tr>
        <tr>
          <td height="20"></td>
        </tr>
      </tbody></table>
    </div>
    <!--建設設計中間完---->
    </div>
</div>    
<!--首頁右側內容。。。-->
<script>
	$().ready(function(e) {
		$(".qm_left").click(function(){ 
			$(".qm_left").hide(); //當前按鈕隱藏
			$(".qm_right").show(); //向右按鈕顯示
			$("#index_right").animate({ left: '210px' }, "50"); //向左移動
		})
		$(".qm_right").click(function(){ 
			$(".qm_right").hide(); //當前按鈕隱藏
			$(".qm_left").show(); //向右按鈕顯示
			$("#index_right").animate({ left: '580px' }, "50"); //向右移動
		})
		//點擊聯系按鈕時,顯示隱藏
		$(".contact").toggle(function(){ 
			$(".contact_body").fadeIn(100);
		},function(){ 
			$(".contact_body").fadeOut(100);
		})
    });
</script>
<div style="left: 580px;" id="index_right">
   	  <div id="index_r_body" style="background-image:url(images/20131112151607120269.jpg); background-repeat:no-repeat; background-position:left middle;">
        <!--聯系我們按鈕-->
        <div class="contact"><img src="images/cntact.jpg" height="90" width="25"></div>
        <div class="contact_body"><img src="images/ewm.jpg" height="175" width="120"></div>
        <div style="display: none;" class="qm_right" id="sy_r"><img src="images/qm.jpg" height="60" width="25"></div>
        <div style="display: block;" class="qm_left" id="sy_l"><img src="images/qml.jpg" height="60" width="25"></div>
            <table border="0" cellpadding="0" cellspacing="0" width="490">
              <tbody><tr>
                <td height="80" width="1500">&nbsp;</td>
              </tr>
              <tr>
                <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="405">
                  <tbody><tr>
                    <td><div style="width:3px; height:230px; float:left; margin-top:5px; background-color:#74777E;"></div><table border="0" cellpadding="0" cellspacing="0" align="right" width="380">
                      <tbody><tr>
                        <td width="430"><img src="images/hui_z.png" height="112" width="251"></td>
                      </tr>
                      <tr>
                        <td height="20">&nbsp;</td>
                      </tr>
                      <tr>
                        <td><table border="0" cellpadding="0" cellspacing="0" width="320">
                          <tbody><tr>
                            <td width="126"><a href="/"><img src="images/b1_002.png" name="Image26" id="Image26" height="104" width="104"></a></td>
                            <td width="127"><a href="/"><img src="images/b2.png" name="Image27" id="Image27" height="104" width="104"></a></td>
                            <td width="127"><a href="/"><img src="images/b3.png" name="Image28" id="Image28" height="104" width="105"></a></td>
                          </tr>
                        </tbody></table></td>
                      </tr>
                    </tbody></table></td>
                  </tr>
                </tbody></table></td>
              </tr>
            </tbody></table>
    </div>
    <div id="zb_r_body" style="background-image:url(img/big2.jpg); background-repeat:no-repeat; background-position:left middle; ">
      <!--聯系我們按鈕-->
        <div class="contact"><img src="images/cntact.jpg" height="90" width="25"></div>
        <div class="contact_body"><img src="images/ewm.jpg" height="175" width="120"></div>
      <div style="display: none;" class="qm_right" id="sy_r"><img src="images/qm.jpg" height="60" width="25"></div>
      <div style="display: block;" class="qm_left" id="sy_l"><img src="images/qml.jpg" height="60" width="25"></div>
            <table border="0" cellpadding="0" cellspacing="0" width="490">
              <tbody><tr>
                <td height="80" width="1500">&nbsp;</td>
              </tr>
              <tr>
                <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="405">
                  <tbody><tr>
                    <td><div style="width:3px; height:230px; float:left; margin-top:5px; background-color:#74777E;"></div>
                      <table border="0" cellpadding="0" cellspacing="0" align="right" width="380">
                        <tbody><tr>
                          <td width="430"><img src="images/hui_z.png" height="112" width="251"></td>
                        </tr>
                        <tr>
                          <td height="20">&nbsp;</td>
                        </tr>
                        <tr>
                          <td><table border="0" cellpadding="0" cellspacing="0" width="320">
                            <tbody><tr>
                              <td width="126"><a href="/"><img src="images/b1_002.png" name="Image1" id="Image1" height="104" width="104"></a></td>
                              <td width="127"><a href="/"><img src="images/b2.png" name="Image21" id="Image21" height="104" width="104"></a></td>
                              <td width="127"><a href="/"><img src="images/b3.png" name="Image31" id="Image31" height="104" width="105"></a></td>
                            </tr>
                          </tbody></table></td>
                        </tr>
                      </tbody></table></td>
                  </tr>
                </tbody></table></td>
              </tr>
            </tbody></table>
    </div>
    <div id="zc_r_body" style="background-image:url(uppic/20131111/20131111093005807162.jpg); background-repeat:no-repeat; background-position:left middle;">
      <!--聯系我們按鈕-->
        <div class="contact"><img src="images/cntact.jpg" height="90" width="25"></div>
        <div class="contact_body"><img src="images/ewm.jpg" height="175" width="120"></div>
      <div style="display: none;" class="qm_right" id="sy_r"><img src="images/qm.jpg" height="60" width="25"></div>
      <div style="display: block;" class="qm_left" id="sy_l"><img src="images/qml.jpg" height="60" width="25"></div>
            <table border="0" cellpadding="0" cellspacing="0" width="490">
              <tbody><tr>
                <td height="80" width="1500">&nbsp;</td>
              </tr>
              <tr>
                <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="405">
                  <tbody><tr>
                    <td><div style="width:3px; height:230px; float:left; margin-top:5px; background-color:#74777E;"></div>
                      <table border="0" cellpadding="0" cellspacing="0" align="right" width="380">
                        <tbody><tr>
                          <td width="430"><img src="images/hui_z.png" height="112" width="251"></td>
                        </tr>
                        <tr>
                          <td height="20">&nbsp;</td>
                        </tr>
                        <tr>
                          <td><table border="0" cellpadding="0" cellspacing="0" width="320">
                            <tbody><tr>
                              <td width="126"><a href="/"><img src="images/b1_002.png" name="Image22" id="Image22" height="104" width="104"></a></td>
                              <td width="127"><a href="/"><img src="images/b2.png" name="Image32" id="Image32" height="104" width="104"></a></td>
                              <td width="127"><a href="/"><img src="images/b3.png" name="Image41" id="Image41" height="104" width="105"></a></td>
                            </tr>
                          </tbody></table></td>
                        </tr>
                      </tbody></table></td>
                  </tr>
                </tbody></table></td>
              </tr>
            </tbody></table>
    </div>
    <div id="jz_r_body" style="background-image:url(uppic/20131230/20131230143333436560.jpg); background-repeat:no-repeat; background-position:left middle; display:;">
      <!--聯系我們按鈕-->
        <div class="contact"><img src="images/cntact.jpg" height="90" width="25"></div>
        <div class="contact_body"><img src="images/ewm.jpg" height="175" width="120"></div>
      <div style="display: none;" class="qm_right" id="sy_r"><img src="images/qm.jpg" height="60" width="25"></div>
      <div style="display: block;" class="qm_left" id="sy_l"><img src="images/qml.jpg" height="60" width="25"></div>
            <table border="0" cellpadding="0" cellspacing="0" width="490">
              <tbody><tr>
                <td height="80" width="1500">&nbsp;</td>
              </tr>
              <tr>
                <td><table border="0" cellpadding="0" cellspacing="0" align="right" width="405">
                  <tbody><tr>
                    <td><div style="width:3px; height:165px; float:left; margin-top:5px; background-color:#fff;"></div>
                      <table border="0" cellpadding="0" cellspacing="0" align="right" width="380">
                        <tbody><tr>
                          <td width="430"><img src="images/sj.png" height="50" width="227"></td>
                        </tr>
                        <tr>
                          <td height="20">&nbsp;</td>
                        </tr>
                        <tr>
                          <td><table border="0" cellpadding="0" cellspacing="0" width="320">
                            <tbody><tr>
                              <td width="126"><a href="/"><img src="images/a1.png" id="Image43" height="105" width="103"></a></td>
                              <td width="127"><a href="/"><img src="images/b1.png" id="Image2" height="105" width="103"></a></td>
                              <td width="127"><a href="/"><img src="images/c1.png" id="Image3" height="105" width="103"></a></td>
                            </tr>
                          </tbody></table></td>
                        </tr>
                      </tbody></table></td>
                  </tr>
                </tbody></table></td>
              </tr>
            </tbody></table>
    </div>
</div>
<div class="bottomuse">
	<div class="left_bottom" style="margin-top:-260px;">
        <div class="bottom2"></div>
        <div class="bottom2" style="border-bottom:1px solid #191B1A; padding-bottom:10px; line-height:40px; background-image:url(jzimg/bottom_1.jpg); background-repeat:no-repeat; background-position:30px 3px;;"><a href="/" style="font-size:18px; font-family:微軟雅黑; color:#00C; padding-left:8px;">  招賢納士</a></div>
        <div class="bottom2" style="border-bottom:1px solid #191B1A; padding-bottom:10px; line-height:40px; background-image:url(jzimg/bottom_2.jpg); background-repeat:no-repeat; background-position:30px 3px;; margin-bottom:10px;"><a href="/" style="font-size:18px; font-family:微軟雅黑; color:#00C; padding-left:8px;">聯系我們</a></div>
      <div class="bottom3" style="margin-top:25px;"><a href="/"><img src="images/zxyd.jpg" height="53" width="131"></a></div>
        <!--<div class="bottome4"><div style="padding-left:22px;width:150px;">Copyright ? 2013 三益中國<br>滬ICP備12044451號-1</div></div>-->
	</div>
</div>
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: flash導航菜單 flash導航條 flash導航 flash菜單 flash下拉菜單 flash下拉導航菜單 h5動畫導航 h5動畫菜單 html5動畫導航 html5動畫菜單 收縮菜單 收縮導航 右鍵菜單 導航切換 菜單切換 浮動菜單 浮動導航 滑動導航菜單 滑動導航 滑動菜單 滾動導航菜單 滾動菜單 滾動導航 彈出層拖動 浮動 懸浮 懸浮層 懸浮框 浮動層 浮動框 浮動插件 懸浮插件 窗口 彈出 彈窗 彈出層 提示框 對話框 遮罩 遮罩層 彈窗插件 浮動提示框 導航菜單 導航條 菜單欄 導航欄 分類導航 響應式導航條 響應式導航 圖片廣告 提示框/彈出層 側邊菜單 側邊導航
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子