1
我按照我的要求設置我的標題樣式有問題。我的標題包含3個div。第一個包含表格，在我的情況下代表的標籤每個標籤是在「td標籤」普通「tr標籤」下，我用jquery「jquery-1.5.1.min.js」，我不能附加js文件我希望你能從互聯網上獲得它的運動。剩下的兩個div用於按鈕左右移動桌子。首先，我希望你能很好地理解我的情況。 我的要求，我不能滿足他們是：標題定位，樣式和瀏覽器窗口滾動
1.i不希望滾動左右欄出現，我試圖設置身體的溢出屬性：隱藏然後它的工作，但是當調整大小瀏覽器窗口現在有調整大小。
2.我不想其餘的選項卡，你可以看到他們，如果你向右滾動至appear.only我想7個標籤，當我點擊向左或向右其餘的選項卡來。
3.我想，當我從任何計算機眉頭此頁面具有相同的大小。我的意思是頭部正好填滿了瀏覽器窗口的頂部，沒有向左或向右滾動，並且確切高度等於65px。因爲它在我的筆記本電腦中似乎確定，但是當我在我的朋友筆記本電腦中嘗試時，標題完全改變了它的位置。
我覺得位置風格影響的頭，我用的是絕對的，但程序員之一，我問一邊是不將其設置爲絕對是個好主意！
這項工作花了我一個多星期我在改型和重新定位花了幾個小時，但我不明白這一點。我希望你理解我，遺憾的長款：/
我的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>
<title>Untitled Page</title>
<script src=jquery-1.5.1.min.js></script>
<style type="text/css">
a.taps_link
{
text-decoration:none;
color:White;
text-shadow: 2px 2px 7px #111;
color: #f5f5f5;
}
img.direction:hover
{
padding:1px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
td.taps:hover
{
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.41, rgb(73,75,75)),
color-stop(0.92, rgb(40,41,41))
);
background-image: -moz-linear-gradient(
center bottom,
rgb(73,75,75) 41%,
rgb(40,41,41) 92%
);
border-bottom-color:#494b4b;
}
td.taps
{
text-align:center;
text-align:center;
min-width:140px;
padding:6px 4px 6px 4px
}
body
{
font-family:Tahoma;
font-size:15px;
}
#header_top
{
text-shadow: 2px 2px 7px #111;
color: #f5f5f5;
}
</style>
</head>
<body style=" background-color:Green;">
<!--#D0D0D0-->
<div style=" height:65px; background-color: Black; margin:-8px -8px 0px -8px ;">
<!--#336699#494B4B-->
<div id="tab_Menu_container" style=" overflow:inherit;margin-left:274px;position:absolute; z-index:3; margin-top:-10px; width:80%;" >
<table rules="all" id="tab_Menu" style=" margin-top:43px; position:absolute">
<tr >
<td class="taps"><a class="taps_link" href="#">first</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">aabbccddeeffgghhiijj</a></td>
<td class="taps"><a class="taps_link" href="#">final</a></td>
</tr>
</table>
</div>
<div id="upLeft_corner" style=" height:65px; width:274px;background-color:Aqua; position:absolute;z-index:4">
<input type="button" value="<<" id="b" alt="previous situation" style="position:absolute;margin-left:240px;margin-top:41px" />
<!--<img src="previous.png" id="b" alt="previous situation" style="position:absolute;margin-left:252px;margin-top:41px"/><<-->
</div>
<div id="upRight_corner" style=" margin-left: 1318px;height:65px; width:112px; background-color: Aqua; position:absolute; z-index:4">
<input type="button" value=">>" id="a" alt="next situation" style="position:absolute;margin-top:41px" />
<!--
<img src="next.png" id="a" alt="next situation" style="position:absolute;margin-top:41px"/>
<img src="all.png" id="all" alt="Show all situation" style="position:absolute;margin-top:41px;margin-left:29px; "/>-->
</div>
</div>
<script>
var counter,td_counter;
counter=0;
td_counter= document.getElementById('tab_Menu').getElementsByTagName('tr')[0].getElementsByTagName('td').length;
console.log(td_counter);
if (td_counter <= 7) {
$("#a").hide();
$("#b").hide();
$("#all").hide();
}
if (counter == 0) {
$("#a").hide();//a= >>
}
//rigth
$("#a").click(function() {
$("#b").show();
counter--;
$("#tab_Menu").animate({ "left": "+=150px" }, "slow");
if(counter==0)
{
$("#a").hide();
}
/*$("#b").show();
right_counter++;
$("#tab_Menu").animate({ "left": "+=152px" }, "slow");
var temp1 = td_counter - right_counter;
if (temp1==temp) {
$("#a").hide();
}*/
});
//left
$("#b").click(function() {
console.log(counter);
$("#a").show();
counter++;
$("#tab_Menu").animate({ "left": "-=149px" }, "slow");
if (counter+7>=td_counter)
{
$("#b").hide();
}
/*
$("#a").show();
left_counter++;
$("#tab_Menu").animate({ "left": "-=152px" }, "slow");
temp = td_counter - left_counter;
if (temp == 7) {
$("#b").hide();
//left_counter = 0;
}*/
});
</script>
</body>
</html>
，如果任何機構有想法，請幫助我仍然有problems.i使用加里綠色的方式，但不與工作表中，我相信我做了幾個錯誤的;因爲當我把表或列表隱藏所有內容不僅溢出:( – 2011-03-27 20:44:54
我還在等你的程序員。 – 2011-03-28 14:24:38