ws2z3gr2017 7 years ago
parent
commit
b61947abe9

BIN
img/bottom1_02.png


BIN
img/bottom_bgtop.png


BIN
img/coupon_big.jpg


BIN
img/highTech_slide_1.jpg


BIN
img/highTech_slide_2.jpg


BIN
img/highTech_slide_3.jpg


BIN
img/highTech_slide_4.jpg


BIN
img/highTech_slide_5.jpg


BIN
img/service_04.png


BIN
img/service_1.png


BIN
img/service_10.png


BIN
img/service_11.png


BIN
img/service_15.png


BIN
img/service_2.png


BIN
img/service_3.png


BIN
img/service_6.png


+ 1 - 1
src/css/public.css

@@ -67,7 +67,7 @@ header .nav_right a:hover{color: #2a6597;}
 
 
 /*右侧挂件*/
-.pub_fix{width: 70px;position: fixed;right: 68px;bottom: 150px;border-radius: 10px;border: 1px solid #e0e0e0;overflow: hidden;text-align: center;height: 382px;background: #ffffff;}
+.pub_fix{width: 70px;position: fixed;right: 68px;bottom: 100px;border-radius: 10px;border: 1px solid #e0e0e0;overflow: hidden;text-align: center;height: 382px;background: #ffffff;}
 .pub_fix .index_blur{width: 100%;height: 30px;line-height: 30px;background: #4c7fa9;display: inline-block;}
 .pub_fix .index_orange{width: 100%;height: 30px;line-height: 30px;background: #ffd68f;display: inline-block;}
 .pub_fix ul li:first-child{border: none;}

+ 1 - 1
src/css/service.css

@@ -98,4 +98,4 @@ line-height: 120px;}
 .bottom{height: 310px;}
 .bottom>img{height: 310px;}
 .bottom_text{margin-top: -100px;}
-
+.pub_fix{z-index: 999;}

+ 89 - 0
src/js/main_public.js

@@ -0,0 +1,89 @@
+(function(){
+
+    var $imgBig=$('.ct-img-big'),
+        $btnNext=$('.btn-next'),
+        $btnPre=$('.btn-pre'),
+        $CT = $('.carouselt'),
+        $imgSmall=$('.ct-img-small');
+   var $imgWidth=$imgBig.find('li').width();//获取图片的宽度;
+   var $imgLength=$imgBig.children().length;//获取克隆前的图片的长度;
+    // 拷贝第一张和最后一张;把最后一张图放在最前面;把最前面的图放在最后;
+    var  $firstImg=$imgBig.find('li').first(),
+        $lastImg=$imgBig.find('li').last();
+    $imgBig.prepend($lastImg.clone());
+    $imgBig.append($firstImg.clone()); //设置imgBig clone后的宽度
+    $imgBig.width( $imgWidth*$imgBig.children().length)//这时的个数是添加完以后的个数
+    $imgBig.css({'left':'-='+$imgWidth+'px'})//把第一张图放入可视区
+    var pageIndex = 0 ; //img的下标;
+    var isAnimate = false//防止重复点击 上锁
+
+    $btnNext.on('click',function(e){
+        e.preventDefault();
+        playNext();
+        setTimeout(function(){
+        },1500)
+    });
+    $btnPre.on('click',function(e){
+        e.preventDefault();
+        playPre();
+        setTimeout(function(){
+
+        },1500)
+    });
+
+    $imgSmall.find('li').on('click',function(){
+        var smallIdx= $(this).index();
+        if(smallIdx>pageIndex){
+            playNext(smallIdx-pageIndex)
+        }
+        else if(smallIdx<pageIndex){
+            playPre(pageIndex-smallIdx)
+        }
+    });
+    function playNext(n){
+        var idx = n ||1;
+        if(isAnimate) return;
+        isAnimate = true;
+        $imgBig.animate({'left':'-='+ $imgWidth*idx+'px'},function(){
+            //如果页数=图片的最后一个,就让图片回到第一张;即data-index=0;
+            pageIndex = pageIndex+idx;
+            if( pageIndex ===$imgLength ){
+                $imgBig.css({'left':'-'+$imgWidth+'px'})
+                pageIndex = 0;
+            }
+            isAnimate = false;
+            smallImg()
+        })
+    }
+    function playPre(n){
+        var idx = n ||1;
+        if(isAnimate) return;
+        isAnimate = true;
+        $imgBig.animate({'left':'+='+$imgWidth*idx+'px'},function(){
+            pageIndex=pageIndex-idx;
+            if(pageIndex<0){
+                $imgBig.css({'left':'-'+$imgWidth*$imgLength+'px'});
+                pageIndex = $imgLength-1;
+            }
+            isAnimate = false;
+            smallImg()
+        })
+    }
+    //设置小图的class
+    function smallImg(){
+        $imgSmall.children()
+            .removeClass('active')
+            .eq(pageIndex) .addClass('active')
+    }
+    //自动轮播 鼠标进入鼠标离开
+    var timer =setInterval(function(){
+        playNext()
+    },2000);
+    $CT.hover(function(){
+        clearInterval(timer)
+    },function(){
+        timer =setInterval( function(){
+            playNext()
+        },2000)
+    });
+})();

+ 2 - 91
src/js/service.js

@@ -2,97 +2,8 @@ import '../css/bootstrap.less';
 import 'bootstrap/dist/js/bootstrap.js';
 import '../css/public.css';
 import '../css/service.css';
-import './public.js'
-(function(){
-
-    var $imgBig=$('.ct-img-big'),
-        $btnNext=$('.btn-next'),
-        $btnPre=$('.btn-pre'),
-        $CT = $('.carouselt'),
-        $imgSmall=$('.ct-img-small');
-   var $imgWidth=$imgBig.find('li').width();//获取图片的宽度;
-   var $imgLength=$imgBig.children().length;//获取克隆前的图片的长度;
-    // 拷贝第一张和最后一张;把最后一张图放在最前面;把最前面的图放在最后;
-    var  $firstImg=$imgBig.find('li').first(),
-        $lastImg=$imgBig.find('li').last();
-    $imgBig.prepend($lastImg.clone());
-    $imgBig.append($firstImg.clone()); //设置imgBig clone后的宽度
-    $imgBig.width( $imgWidth*$imgBig.children().length)//这时的个数是添加完以后的个数
-    $imgBig.css({'left':'-='+$imgWidth+'px'})//把第一张图放入可视区
-    var pageIndex = 0 ; //img的下标;
-    var isAnimate = false//防止重复点击 上锁
-
-    $btnNext.on('click',function(e){
-        e.preventDefault();
-        playNext();
-        setTimeout(function(){
-
-        },1500)
-    });
-    $btnPre.on('click',function(e){
-        e.preventDefault();
-        playPre();
-        setTimeout(function(){
-
-        },1500)
-    });
-
-    $imgSmall.find('li').on('click',function(){
-        var smallIdx= $(this).index();
-        if(smallIdx>pageIndex){
-            playNext(smallIdx-pageIndex)
-        }
-        else if(smallIdx<pageIndex){
-            playPre(pageIndex-smallIdx)
-        }
-    });
-    function playNext(n){
-        var idx = n ||1;
-        if(isAnimate) return;
-        isAnimate = true;
-        $imgBig.animate({'left':'-='+ $imgWidth*idx+'px'},function(){
-            //如果页数=图片的最后一个,就让图片回到第一张;即data-index=0;
-            pageIndex = pageIndex+idx;
-            if( pageIndex ===$imgLength ){
-                $imgBig.css({'left':'-'+$imgWidth+'px'})
-                pageIndex = 0;
-            }
-            isAnimate = false;
-            smallImg()
-        })
-    }
-    function playPre(n){
-        var idx = n ||1;
-        if(isAnimate) return;
-        isAnimate = true;
-        $imgBig.animate({'left':'+='+$imgWidth*idx+'px'},function(){
-            pageIndex=pageIndex-idx;
-            if(pageIndex<0){
-                $imgBig.css({'left':'-'+$imgWidth*$imgLength+'px'});
-                pageIndex = $imgLength-1;
-            }
-            isAnimate = false;
-            smallImg()
-        })
-    }
-    //设置小图的class
-    function smallImg(){
-        $imgSmall.children()
-            .removeClass('active')
-            .eq(pageIndex) .addClass('active')
-    }
-    //自动轮播 鼠标进入鼠标离开
-    var timer =setInterval(function(){
-        playNext()
-    },2000);
-    $CT.hover(function(){
-        clearInterval(timer)
-    },function(){
-        timer =setInterval( function(){
-            playNext()
-        },2000)
-    });
-})();
+import './public.js';
+import './main_public.js'