前端开发过程中需要不断学习,不断温习。最近计划白天继续温习jquery,晚上学习下原生javascript,然后利用一些时间做做网站推广SEO来着。计划暂时这些。 白天活干完,弄个jquery仿凡客诚品图片切换的效果 以前写的不是很好,今天重新做个 jquery特效,其实很简单,漠然回首也就那回事。 先来个原型吧,锋利的jquery第一个例子,相信大家都很熟悉。没错,你绝对没看错。 代码如下 复制代码 代码如下: 第一张 11111111 11111111 11111111 11111111 11111111 11111111 第二张 22222222 22222222 22222222 22222222 22222222 22222222 第三张 33333333 33333333 33333333 33333333 33333333 33333333 第四张 44444444 44444444 44444444 44444444 44444444 44444444 <BR>$(document).ready(function(){ <BR>// $(".has_children").click(function(){ <BR>// $(this).addClass("highlight").children("a").show().end().siblings().removeClass("highlight").children("a").hide();//点击后效果 <BR>// }) <BR>$(".has_children").mouseover(function(){ <BR>$(this).addClass("highlight").children("a").show().end().siblings().removeClass("highlight").children("a").hide();//鼠标移动过去效果 <BR>}) <BR>}) <BR> 原书是点击后的效果,我又加了个鼠标移动上去。 现在适当的修改下css和js就可以了。 在线效果原型DEMO 在线效果图文切换DEMO