经过一周多，整个服装商城项目已经完全的结束，对于这次的项目，我深切的明白自己不足的地方，也知道了自己要从哪里下手以及我和我的团队之间相互配合。 然后整个服装商城很多知识都涉及到了我的知识盲区，对此要不我不了解的进一步记录下来，慢慢熟悉过程：
$(function() { //轮播图 var index = 0; var timeId; //获取图片滚动的高度 var height = $(".ad").height(); //页面加载完毕让其下标为1的li高亮显示 $(".num li:first").addClass("on"); //当鼠标移动到li元素上时，当前li元素高亮显示 $(".num li").mouseover(function() { //获取当前鼠标放入的li元素所在的索引位置 index = $(".num li").index($(this)); //执行滚动方法，传index进来就是当用户滑到第几张的时候就显示第几张 showImg(index); }); //当鼠标放入图片上时，停止滚动（清除定时器），鼠标离开，开始滚动（启动定时器） $(".ad").hover(function() { //清除定时器 clearInterval(timeId); }, function() { //启动定时器 timeId = setInterval(function() { index++; if(index == 5) { index = 0; } showImg(index); }, 2000); }).trigger("mouseout"); function showImg(index) { //获取图片滚动高度 var height = $(".ad").height(); //根据当前索引使图片移动到对应的距离高度 $(".slider").animate({ top: -index * height }, 1000); $(".num li").eq(index).addClass("on").siblings().removeClass("on"); }; //导航菜单收起 // $(".module_up_down").toggle(function(){ // var $self = $(this); // $self.prev().slideToggle(600); // },function(){ // var $self = $(this); // $self.prev().slideToggle(600) // }); $(function() { //最新动态 $(".module_up_down img:first").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) }) }) //产品分类 $(".module_up_down img:eq(1)").click(function() { var $this = $(this); $(".m-treeview").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) }) }) //衬衫卫衣裤子二级菜单 $(".m-treeview>li").click(function() { var cl = $(this).attr("class"); if(cl == "m-collapsed") $(this).attr("class", "m-expanded"); else if(cl == "m-expanded") $(this).attr("class", "m-collapsed") }) }) //衬衫大图左右切换 // var left = 0; // var right = 2; // $(".goRight").click(function() { // right--; // if(right < 3) { // right = 2; // } // $(".prolist_content").animate({ // "left": (-584) * right + "px" // }); // }) // $(".goLeft").click(function() { // left++; // if(left >= 3) { // left = 0; // } // $(".prolist_content").animate({ // "left": (-584) * index + "px" // }); // }) $(function() { var page = 1; var i = 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); page = 1; } else { $parent.animate({ left: '-=' + none_unit_width }, 800); page++; } } }); //左按钮 $(".goLeft").click(function() { if(!$parent.is(":animated")) { if(page == 1) { $parent.animate({ left: '-=' + none_unit_width * (page_count - 1) }, 800); page = page_count; } else { $parent.animate({ left: '+=' + none_unit_width }, 800); page--; } } }); }); //最新动态 新闻滚动 // 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() { setInterval(function() { $(".scrollNews li:first").remove().appendTo($(".scrollNews ul")); }, 1000) }) }); //换肤大师第一种 // $(function () { // //给头部颜色的方块进行打勾，当前打勾，其余项打勾移除 // $("#skin li").click(function () { // $(this).addClass("selected").siblings().removeClass("selected"); // var cssName = $(this).attr("id"); // changeSk(cssName); // // }) // if ($.cookie("MyCookie")) { // var cssName = $.cookie("MyCookie"); // changeSkin(cssName); // $("#" + cssName).addClass("selected").siblings().removeClass("selected"); // } // function changeSk(cssName) { // $("#cssfile").attr("href", "styles/skin/" + cssName + ".css"); // $.cookie("MyCookie", cssName, { expires: 7, path: '/' }); // } // }); //换肤大师第二种 // $(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") // }) // })对于这些得慢慢熟悉过程以及以后叨叨使用js文件从外部导入
