基于jQuery实现仿百度首页换肤背景图片切换代码

不多说了，先给大家展示效果图，本文支持源码下载哦，需要的朋友可以直接下载使用，代码很简单哦~

在线预览源码下载

超文本标记语言代码：

a href='# '换肤/adiv class=' hei zoo '/div div class=' con ' img src=' http : images/content。png/div class=' head ' div class=' menu ' div class=' title ' p class=' P1 '/p p class=' p2 '/p/div class=' BG ' div class=' bgcon ' img class=' big ' src=' http : images/bg0s。jpg ' img src=' http :0 '$('a ').单击(函数(){ $(').head ').动画({height:'288px'}，500)；});$(.p2 ').单击(函数(){ $(').head ').动画({height:'0px'}，500)；});$('.bgcon img ').悬停(function(){ i=$(this)).index()；$('.bgyl ').css(“”背景，' url(图像/bg' i ').jpg)')；$('.bgyl ').css(“”背景大小，' 264像素180像素'；});$('.bgcon img ').单击(function(){ $(“body”)).css(“”背景，' url(图像/bg' i ').jpg)')；});/scriptcss代码：

* { margin :0 padd :0 } a { color : # fffmargin-top :10 px；显示：块；保证金-左侧：18%;font-size :13 px位置：绝对；}正文{背景： URL(图片/bg0。jpg)；} .con { width:911px高度：317 px余量：50px汽车；} .头部{宽度：100%;高度：0像素背景# fff位置：固定；left :0 pxtop :0 pxborder-bottom :1 px实心# e3e3e3飞越：隐藏；} .标题{ width :911 pxh8 :45 pxmargin 33600 px汽车；} .黑条{宽度：100%;height :35 pxbackground : rgba(0，0，0，0.7)；} .菜单{宽度：100%；高度：45 pxborder-底部：1px实心# e3e3e 3 } . P1 { width :861 px h8 :45 px background : URL(图片/P1。巴布亚新几内亚)；float:leftcursor:pointer指针指针；} . p2 { width :50 pxh array :45 px background : URL(images/sp。巴布亚新几内亚)；右浮动：光标：指针指针；} .BG { width :911 pxh8 :205 pxmargin 336025 px汽车；} .bgcon {宽度：590px高度：190 pxfloat:left}。bgcon img { width:97px高度：59 px显示：块；float:left右边距：1 px边距-底部：1 px} .bgcon .大{ width:195px高度：119 px} .bgcon .最后{ position : relative top :-60px；} .bgyl { width:264px高度：180 px右浮动：背景： URL(图片/bg1s。jpg)；背景尺寸size:294px}以上代码就是本文介绍基于jQuery实现仿百度首页换肤背景图片切换代码，希望大家喜欢。