欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  说明:
 
  实现功能:
 
  1、鼠标经过表格行的时候,变色
 
  2、控制表格表头不受影响.“经过事件不变,点击事件不变”;
 
  3、表格每一行有4个td,并实现只能点击第3个td,添加鼠标手形属性,而且当点击每行的第3个td的时候,把td的高度变高.
 
  4、而且第3个td里面,有两个元素,一个是含有类.titlef 的div元素,默认显示; 另一个是含有类.content 的
 
  div元素,默认隐藏; 当点击第3个td的时候,就把.content 显示出来,把当点击其他tr td的时候,还原含有
 
  类.content的div 变隐藏“用echo 遍历实现了”
 
  $(document).ready(function(){
 
  $(".tableLine tr:not(tr:first) td:even").css("cursor","pointer")
 
  $(".tableLine tr:not(tr:first) td:even ").click(function(){ ? ? ? ?$(".tableLine .content").each(function()$(this).hide(); ? ? ? ? });
 
  $(".tableLine tr:not(tr:first) td:even").css("height","40px").css("padding-top","0px");
 
  $(this).css("height","80px").css("padding-top","10px");
 
  $(this).children().show();
 
  });
 
  $(".tableLine tr:not(tr:first)").mouseover(function(){
 
  $(this).children().css("background","#efefef");
 
  });
 
  $(".tableLine tr:not(tr:first)").mouseleave(function(){
 
  $(this).children().css("background","#fff");
 
  });
 
  });

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h62074.shtml