404.js 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. var parallel = 17;
  2. var headHeight = 150;
  3. var opacity = 0;
  4. var eyeBrowHeight = 0;
  5. var step = 1;
  6. var timer_show;
  7. var timer_eyebrow;
  8. document.onmousemove = mouseMove;
  9. function mouseMove(e){
  10. /*眼球转动*/
  11. }
  12. function startAnimation(){
  13. timer_show = setInterval('rotateCounterclockwise()', 55);
  14. window.setTimeout(function(){
  15. window.clearInterval(timer_eyebrow);
  16. timer_show = setInterval('rotateClockwise()', 55);
  17. },1000*6);
  18. }
  19. function rotateCounterclockwise() {
  20. parallel = parallel - 0.3;
  21. headHeight = headHeight - 2.5;
  22. opacity = (17 - parallel)/17;
  23. if(parallel > 0) {
  24. $('.head').css('top',headHeight+'px');
  25. $('.hat').css('transform', 'rotate(' + parallel + 'deg)');
  26. // $('.code p').css('opacity',opacity);
  27. $('.bubble').css('opacity',opacity);
  28. }else{
  29. window.clearInterval(timer_show);
  30. timer_eyebrow = setInterval('flash()',10);
  31. }
  32. }
  33. function rotateClockwise() {
  34. parallel = parallel + 0.3;
  35. headHeight = headHeight + 2.5;
  36. opacity = (17 - parallel)/17;
  37. if(parallel <= 17) {
  38. $('.head').css('top',headHeight+'px');
  39. $('.hat').css('transform', 'rotate(' + parallel + 'deg)');
  40. // $('.code p').css('opacity',opacity);
  41. $('.bubble').css('opacity',opacity);
  42. }else{
  43. window.clearInterval(timer_show);
  44. startAnimation();
  45. }
  46. }
  47. function flash(){
  48. eyeBrowHeight += step;
  49. $('.lefteye .eyebrow').css('clip','rect(0px 38px ' + eyeBrowHeight + 'px 0px)');
  50. $('.righteye .eyebrow').css('clip','rect(0px 38px ' + eyeBrowHeight + 'px 0px)');
  51. if(eyeBrowHeight % 19 === 0)
  52. step = -step;
  53. }
  54. startAnimation();