main.js 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. $(document).ready(function () {
  2. /* Портфолио */
  3. $('.button[filter]').click(function () {
  4. if ($(this).attr('val') == 'off') {
  5. $('.button[filter]').attr('val', 'off').removeClass('focused');
  6. $(this).attr('val', 'on').addClass('focused');
  7. $('.filter > div').hide(300);
  8. $('.filter > div[filter=' + $(this).attr('filter') + ']').show(300);
  9. if ($(this).attr('filter') == 'all') {
  10. $('.button[filter]').attr('val', 'off').removeClass('focused');
  11. $(this).attr('val', 'on').addClass('focused');
  12. $('.filter > div').show(300);
  13. }
  14. }
  15. });
  16. /* Слайдер */
  17. $('.multiple-items').slick({
  18. infinite: true,
  19. slidesToShow: 3,
  20. slidesToScroll: 3,
  21. arrows: false,
  22. dots: true,
  23. dotsClass: 'dots-style',
  24. responsive: [{
  25. breakpoint: 1025,
  26. settings: {
  27. slidesToShow: 2,
  28. slidesToScroll: 2,
  29. }
  30. }, {
  31. breakpoint: 480,
  32. settings: {
  33. slidesToShow: 1,
  34. slidesToScroll: 1,
  35. }
  36. }]
  37. });
  38. /* Меню */
  39. $('ul.menu a[href^="#"').click(function () {
  40. var target = $(this).attr('href');
  41. $('html, body').animate({
  42. scrollTop: $(target).offset().top
  43. }, 500);
  44. $('ul.menu a[href^="#"').css({
  45. 'color': '#212121'
  46. });
  47. $(this).css({
  48. 'color': '#004bee'
  49. });
  50. return false;
  51. });
  52. /* Выпадающее меню */
  53. $('.menu-icon').click(function () {
  54. $('nav').slideToggle(500);
  55. $('ul.menu').css({
  56. 'display': 'flex',
  57. 'flex-direction': 'column'
  58. });
  59. if ($('.menu-icon').html() == '<i class="fas fa-bars"></i>') {
  60. $(this).html('<i class="fas fa-times"></i>');
  61. } else {
  62. $(this).html('<i class="fas fa-bars"></i>');
  63. }
  64. });
  65. /* Кнопка наверх */
  66. $(window).scroll(function () {
  67. if ($(this).scrollTop() != 0)
  68. $('#toTop').fadeIn();
  69. else
  70. $('#toTop').fadeOut();
  71. });
  72. $('#toTop').click(function () {
  73. $('body,html').animate({
  74. scrollTop: 0
  75. }, 800);
  76. });
  77. });
  78. var btn = document.querySelectorAll('button');
  79. for (var i = 0; i < btn.length; i++) {
  80. btn[i].style.outline = 'none';
  81. }