jquer第四次课

服装商城头部颜色的切换

 $(function(){                                                  $("#skin li").click(function(){                                   $(this).addClass("selected").siblings().removeClass("selected");                                                   var cssName = $(this).attr("id");                                   //alert(cssName)                                   $("#cssfile").attr("href","styles/skin/"+cssName+".css")                               })                              })

 

字体的滚动

$(function() {                     var $this = $(".scrollNews");                     var scrollTimer;                     $this.hover(function() {                         clearInterval(scrollTimer);                     }, function() {                         scrollTimer = setInterval(function() {                             scrollNews($this);                         }, 1000);                     }).trigger("mouseleave");                 });

                function scrollNews(obj) {                     var $self = obj.find("ul:first");                     var lineHeight = $self.find("li:first").height(); //获取行高                     $self.animate({                         "marginTop": -lineHeight + "px"                     }, 600, function() {                         $self.css({                             marginTop: 0                         }).find("li:first").appendTo($self); //appendTo能直接移动元素                     })                 }

                function sp() {                     scroolNews($this);                 }  

 

列表收起：

$(function(){                 //新闻最新动态                 $(".module_up_down img").click(function(){                     var  $this=$(this);                     $(".scrollNews").slideToggle(1000,function(){                         var img =$this.attr("src")                         console.log(img);                         if (img=="images/up.gif") {                             img="images/down.gif";                         }                         else{                             img="images/up.gif";                          }                                                  $this.attr("src",img);                     })                 })                                               })

 

左右滑动；

 $(function(){                  var page = 1;                  var i = 4; //每版放4个图片                  var len = $(".prolist_content ul li").length;                  var page_count = Math.ceil(len / i) ;   //只要不是整数，就往大的方向取最小的整数                  var none_unit_width = $(".prolist").width(); //获取框架内容的宽度,不带单位                  var $parent = $(".prolist_content");                   //向右 按钮                  $(".goRight").click(function(){                       if( !$parent.is(":animated") ){                          if( page == page_count ){  //已经到最后一个版面了,如果再向后，必须跳转到第一个版面。                              $parent.animate({ left : 0}, 800); //通过改变left值，跳转到第一个版面                              page = 1;                          }else{                              $parent.animate({ left : '-='+none_unit_width}, 800);  //通过改变left值，达到每次换一个版面                              page++;                          }                      }                 });                  //往左 按钮                  $(".goLeft").click(function(){                      if( !$parent.is(":animated") ){                          if( page == 1 ){  //已经到第一个版面了,如果再向前，必须跳转到最后一个版面。                              $parent.animate({ left : '-='+none_unit_width*(page_count-1)}, 800); //通过改变left值，跳转到最后一个版面                              page = page_count;                          }else{                              $parent.animate({ left : '+='+none_unit_width }, 800);  //通过改变left值，达到每次换一个版面                              page--;                          }                      }                  });              });                           })