js渐变显示渐变消失

以下是渐变的js代码(表示多余三行的要隐藏,点击"more"显示剩下的,点击“less”要逐渐隐藏):
function showAccomplishmentTableRow(){

	$("#accomplishmenttable tr:hidden").first().show(2000,function(){

		showAccomplishmentTableRow();

	 });

	if($("#accomplishmenttable tr:hidden").size()==0){

		$("#accomplishmenttable").next().attr("onclick","hideAccomplishmentTableRow()").text("Less");

	}

}

function hideAccomplishmentTableRow(){

	if($("#accomplishmenttable tr:visible").size()<=3){

		$("#accomplishmenttable").next().attr("onclick","showAccomplishmentTableRow()").text("More");

		return;

	}

	

	$("#accomplishmenttable tr:visible").last().hide(2000,function(){

		hideAccomplishmentTableRow();

	 });

	 

}

html

 

<table id="accomplishmenttable" class="bgWhite border3PGreye7e7e7 marginT20 roundedCorner width100P">

					<tbody>

					<tr class="bgLightGreyf5f5f5 height40">

						<th class="border_bottom3Pgreye7e7e7 border_right1Pgreye7e7e7 border_top1PWhite fontGreyGeneral  textCenter roundedCorner_TL verticalMiddle width30P" colspan="2">MY ACCOMPLISHMENTS</th>

					</tr>

					

					<tr class="bgWhite height40">

							<td class="border_bottom1Pgreye7e7e7 border_right1Pgreye7e7e7 fontGreyGeneral p14Font width20P">

								<div class="margin5">border_bottom1Pgreye7e7e7</div>

							</td>

							<td class="border_bottom1Pgreye7e7e7 border_right1Pgreye7e7e7 fontGreyGeneral p14Font textLeft width80P">

								border_bottom1Pgreye7e7e7

							</td>

						</tr>

					<tr class="bgWhite height40">

							<td class="border_bottom1Pgreye7e7e7 border_right1Pgreye7e7e7 fontGreyGeneral p14Font width20P">

								<div class="margin5">border_bottom1Pgreye7e7e7</div>

							</td>

							<td class="border_bottom1Pgreye7e7e7 border_right1Pgreye7e7e7 fontGreyGeneral p14Font textLeft width80P">

								border_bottom1Pgreye7e7e7

							</td>

						</tr>

</tbody>

				</table>

				<div class="floatR marginT5 p14Font textLink" onclick="showAccomplishmentTableRow();">More</div>

				


 

 

你可能感兴趣的:(js)