index.js 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. import '../css/bootstrap.less';
  2. import 'bootstrap/dist/js/bootstrap.js';
  3. import '../css/newMenu/public.css';
  4. import '../css/newMenu/header.css';
  5. import '../css/index_home.css';
  6. import '../css/indexNew.css';
  7. import './public.js';
  8. import './jquery-2.1.0.js';
  9. (function(){
  10. //搜索框上面栏目的选择
  11. $(".indexSeach_one>ul>li").click(function(){
  12. $(this).parent().children().removeClass("indexActive");
  13. $(this).addClass("indexActive");
  14. })
  15. //搜索功能
  16. $(".indexImg1").click(function(){
  17. var seachon=$(".indexSeach_one>ul>li.indexActive").index();
  18. var key=$("#int").val();
  19. localStorage.setItem("indexKeyWord",key);
  20. switch(seachon){
  21. case 0:window.open(globalConfig.context + '/portal/technologyTrading/achievement.html');break;
  22. case 1:window.open(globalConfig.context + '/portal/technologyTrading/demand.html');break;
  23. case 2:window.open(globalConfig.context + '/portal/technologyTrading/achievement.html');break;
  24. case 3:window.open(globalConfig.context + '/portal/thinkTank/policyList.html');break;
  25. case 4:window.open(globalConfig.context + '/portal/thinkTank/index.html#zizone');break;
  26. case 5:break;
  27. }
  28. })
  29. //申请会员
  30. $(".indexImg2").click(function(){
  31. $(".ret_top>li:nth-child(1)").click();
  32. })
  33. //搜索栏下面的点击,登录判断
  34. $(".seachCont1>div:nth-child(4)>a").click(function(){
  35. var islogin=$("#isLogin").attr("islogin");
  36. if(islogin=="true"){
  37. $(".head_login").click();
  38. }else if(islogin=="false"){
  39. $(this).attr("href","/user/account/demand.html#techDemand");
  40. $(this).click();
  41. }
  42. })
  43. $(".seachCont1>div:nth-child(5)>a").click(function(){
  44. var islogin=$("#isLogin").attr("islogin");
  45. if(islogin=="true"){
  46. $(".head_login").click();
  47. }else if(islogin=="false"){
  48. $(this).attr("href","/user/account/achievement.html#techAchievement");
  49. $(this).click();
  50. }
  51. })
  52. //搜索框下面的页面链接点击
  53. $(".seachMore").click(function(){
  54. if($(this).parent().children("#seachCont").children().attr("clicka")=="0"){
  55. $(this).parent().children("#seachCont").children().animate({"left":"-138px"},"slow").attr("clicka","1");
  56. }else if($(this).parent().children("#seachCont").children().attr("clicka")=="1"){
  57. $(this).parent().children("#seachCont").children().animate({"left":"0px"},"slow").attr("clicka","0");
  58. }
  59. })
  60. //成果需求切换
  61. $(".indexGroom_table>div").click(function(){
  62. $(this).parent().children().removeClass("indexGroom_active");
  63. $(this).addClass("indexGroom_active");
  64. console.log($(this).html());
  65. if($(this).html()=="成果"){
  66. $(".chengguo").css("display","block");
  67. $(".xuqiu").css("display","none");
  68. }else if($(this).html()=="需求"){
  69. $(".chengguo").css("display","none");
  70. $(".xuqiu").css("display","block");
  71. }
  72. })
  73. //滚动导航
  74. $(window).scroll(function(){
  75. var scrolltop=$(document).scrollTop();
  76. if(scrolltop>500){
  77. $('.topNav').addClass('navFix')
  78. }else{
  79. $('.topNav').removeClass('navFix');
  80. }
  81. });
  82. //轮播图的开始
  83. var img_length=$(".ct-img-big").children("li").length-2;
  84. var smallhtml="";
  85. for(var i=1;i<=img_length;i++){
  86. smallhtml+="<li></li>"
  87. }
  88. $(".ct-img-small").html(smallhtml);
  89. var ctwidth=$('.ct-img-small').width();
  90. $('.ct-img-small').css({marginLeft:-ctwidth/2});
  91. $(".ct-img-small").children().eq(0).addClass("active");
  92. var $imgBig=$('.ct-img-big'),
  93. $btnNext=$('.btn-next'),
  94. $btnPre=$('.btn-pre'),
  95. $CT = $('.carouselt'),
  96. $imgSmall=$('.ct-img-small');
  97. var $imgWidth=$imgBig.find('li').width();//获取图片的宽度;
  98. var $imgLength=$imgBig.children().length;//获取克隆前的图片的长度;
  99. // 拷贝第一张和最后一张;把最后一张图放在最前面;把最前面的图放在最后;
  100. var $firstImg=$imgBig.find('li').first(),
  101. $lastImg=$imgBig.find('li').last();
  102. $imgBig.prepend($lastImg.clone());
  103. $imgBig.append($firstImg.clone()); //设置imgBig clone后的宽度
  104. $imgBig.css("width", $imgWidth*$imgBig.children().length+"px")//这时的个数是添加完以后的个数
  105. $imgBig.css({'left':'-='+$imgWidth+'px'})//把第一张图放入可视区
  106. var pageIndex = 0 ; //img的下标;
  107. var isAnimate = false//防止重复点击 上锁
  108. $btnNext.on('click',function(e){
  109. e.preventDefault();
  110. playNext();
  111. setTimeout(function(){
  112. },1500)
  113. });
  114. $btnPre.on('click',function(e){
  115. e.preventDefault();
  116. playPre();
  117. setTimeout(function(){
  118. },1500)
  119. });
  120. $imgSmall.find('li').on('click',function(){
  121. var smallIdx= $(this).index();
  122. if(smallIdx>pageIndex){
  123. playNext(smallIdx-pageIndex)
  124. }
  125. else if(smallIdx<pageIndex){
  126. playPre(pageIndex-smallIdx)
  127. }
  128. });
  129. function playNext(n){
  130. var idx = n ||1;
  131. if(isAnimate) return;
  132. isAnimate = true;
  133. $imgBig.animate({'left':'-='+ $imgWidth*idx+'px'},1500,function(){
  134. //如果页数=图片的最后一个,就让图片回到第一张;即data-index=0;
  135. pageIndex = pageIndex+idx;
  136. if( pageIndex ===$imgLength ){
  137. $imgBig.css({'left':'-'+$imgWidth+'px'})
  138. pageIndex = 0;
  139. }
  140. isAnimate = false;
  141. smallImg()
  142. })
  143. }
  144. function playPre(n){
  145. var idx = n ||1;
  146. if(isAnimate) return;
  147. isAnimate = true;
  148. $imgBig.animate({'left':'+='+$imgWidth*idx+'px'},1500,function(){
  149. pageIndex=pageIndex-idx;
  150. if(pageIndex<0){
  151. $imgBig.css({'left':'-'+$imgWidth*$imgLength+'px'});
  152. pageIndex = $imgLength-1;
  153. }
  154. isAnimate = false;
  155. smallImg()
  156. })
  157. }
  158. //设置小图的class
  159. function smallImg(){
  160. $imgSmall.children()
  161. .removeClass('active')
  162. .eq(pageIndex) .addClass('active')
  163. }
  164. //自动轮播 鼠标进入鼠标离开
  165. var timer =setInterval(function(){
  166. playNext()
  167. },3000);
  168. $CT.hover(function(){
  169. clearInterval(timer)
  170. },function(){
  171. timer =setInterval( function(){
  172. playNext()
  173. },3000)
  174. });
  175. })()