customer.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. // 屏幕试图的高度
  2. let screenHeight = $(window).height()
  3. // 客户管家
  4. let collaborationTeamHight = $('#collaborationTeam').offset().top
  5. $(window).scroll(function () {
  6. // 当前滚动的高度
  7. let currentTop = $(window).scrollTop()
  8. if(currentTop < 2) {
  9. $('#all').removeClass('hanAll')
  10. $('#abc').addClass('abc')
  11. $('#navigationBar').removeClass('white')
  12. $("#loGo").attr("src", './image/logo.png')
  13. } else {
  14. $("#all").addClass("hanAll");
  15. $("#abc").removeClass("abc");
  16. $("#navigationBar").addClass("white");
  17. $("#loGo").attr("src", './image/logo.jpg')
  18. }
  19. // 客户管家滚动计算
  20. if(currentTop > collaborationTeamHight && currentTop < (collaborationTeamHight + screenHeight)) {
  21. let teamOffset = (currentTop - collaborationTeamHight) / screenHeight
  22. console.log(teamOffset, '透明度')
  23. $('#collCentImg').css({'transform': `translate(0, ${(1 - teamOffset) * 250}px)`})
  24. $('#collCentFonts').css({'opacity': teamOffset})
  25. }
  26. })
  27. // 导航下划线
  28. $('.aus li').hover(function () {
  29. let i = $(this).index()
  30. $(".aus li").eq(i).addClass('tils')
  31. },function () {
  32. let i = $(this).index()
  33. $(".aus li").eq(i).removeClass('tils')
  34. })
  35. $('.auss li').hover(function () {
  36. let i = $(this).index()
  37. $(".auss li").eq(i).addClass('tils')
  38. },function () {
  39. let i = $(this).index()
  40. $(".auss li").eq(i).removeClass('tils')
  41. })
  42. // 客服hover
  43. $('#zhixun').hover(function () {
  44. $("#zhixun").show()
  45. $("#consultigImg").attr("src", './image/ions/kefu1.png')
  46. },function () {
  47. $("#zhixun").hide()
  48. $("#consultigImg").attr("src", './image/ions/kefu2.png')
  49. })
  50. $('#consulting').hover(function () {
  51. $("#zhixun").show()
  52. $("#consultigImg").attr("src", './image/ions/kefu1.png')
  53. },function () {
  54. $("#zhixun").hide()
  55. $("#consultigImg").attr("src", './image/ions/kefu2.png')
  56. })
  57. // 产品鼠标移入移出
  58. let fls = true
  59. $('#productHov').hover(function () {$("#product").show()},function () {
  60. setTimeout(function() {
  61. if(fls) {
  62. $("#product").hide()
  63. }
  64. }, 200)
  65. })
  66. $('#product').hover(function () {
  67. fls = false
  68. $("#product").show()
  69. },function () {
  70. fls = true
  71. $("#product").hide()
  72. })
  73. // 特色展示
  74. $('#specialShowConLeftUL li').click(function () {
  75. let index = $(this).index()
  76. // console.log(index, '索引')
  77. $('#tesTex').html(+index + 1 + '/11')
  78. $('#tesSpan').css('width', (+index + 1) * 9.09 + '%')
  79. let arr = $('#specialShowConLeftUL li')
  80. // if(index != '1' && index != '7') {
  81. for(let i in arr) {
  82. $('#specialShowConLeftUL li').removeClass('on')
  83. }
  84. $(this).addClass("on")
  85. $('#easyManBoxConImg').attr("src", './image/customer/li'+(+index + 1)+'.png')
  86. // }
  87. })
  88. // 用户评价点击事件
  89. let numberClick = 0
  90. // 移动的距离
  91. let mobiledistance = 0
  92. $(function() {
  93. kehuFlg()
  94. $('#kehuRight').click(function() {
  95. if(numberClick < 3) {
  96. numberClick++
  97. zuoyouClick()
  98. }
  99. })
  100. $('#kehuLeft').click(function() {
  101. if(numberClick > 0 && numberClick <= 3) {
  102. numberClick--
  103. zuoyouClick()
  104. }
  105. })
  106. })
  107. function zuoyouClick() {
  108. console.log(numberClick)
  109. mobiledistance = '-' + (numberClick * 68.75) + 'rem'
  110. $('.evaluationConIkun').stop(true,false).animate({
  111. 'left': mobiledistance
  112. }, 400)
  113. kehuFlg()
  114. }
  115. function kehuFlg() {
  116. if(numberClick == 0) {
  117. $('#kehuLeft').addClass("zhis")
  118. } else {
  119. $('#kehuLeft').removeClass("zhis")
  120. }
  121. if(numberClick >= 3) {
  122. $('#kehuRight').addClass("zhis")
  123. } else {
  124. $('#kehuRight').removeClass("zhis")
  125. }
  126. }