site.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. var $cards = $('#items .full-works');
  2. var $card = $('#items .card');
  3. var $cat = $('.cat-list .cat a');
  4. var $img = $('.item #items .img');
  5. function masonry() {
  6. var $grid = $cards.masonry({
  7. itemSelector: '.card',
  8. columnWidth: '.card',
  9. percentPosition: true,
  10. gutter: 10,
  11. isAnimated: true,
  12. transitionDuration: '0.5s'
  13. });
  14. var $grid2 = $img.masonry({
  15. itemSelector: '.img-card',
  16. columnWidth: '.img-card',
  17. percentPosition: true,
  18. gutter: 10,
  19. transitionDuration: '0.2s'
  20. });
  21. $(".cat-list .btn a").click(function(e) {
  22. e.preventDefault();
  23. $('.active').removeClass('active');
  24. $(this).addClass('active');
  25. var filter = $(this).attr("data-filter");
  26. var self = $('#body-wrapper #items .full-works');
  27. self.masonryFilter({
  28. filter: function () {
  29. if (!filter) return true;
  30. return $(this).attr("data-filter") == filter;
  31. }
  32. });
  33. });
  34. $grid.imagesLoaded().progress(function() {
  35. $grid.masonry();
  36. });
  37. $grid2.imagesLoaded().progress(function() {
  38. $grid2.masonry();
  39. });
  40. }
  41. function filteritem() {
  42. var $card = $('#body > .card');
  43. var $cat = $('.cat a');
  44. var $img = $('#body .img');
  45. }
  46. function contact() {
  47. var $contact = $('header .contact h3');
  48. $contact.on('click', function() {
  49. if ($(this).parent(".contact").hasClass('open')) {
  50. $(this).parent(".contact").removeClass('open');
  51. $(this).parent(".contact").addClass('close');
  52. } else {
  53. $(this).parent(".contact").addClass('open');
  54. $(this).parent(".contact").removeClass('close');
  55. }
  56. })
  57. }
  58. var $page = $('#page-wrapper.blog');
  59. function customscroll($page_item) {
  60. var $page_item = $("#page-wrapper.item");
  61. $page_item.mCustomScrollbar({
  62. theme: "dark",
  63. scrollbarPosition: "outside",
  64. scrollInertia: 1000,
  65. callbacks: {
  66. onInit: function(){
  67. $('.top').on('click', function() {
  68. event.preventDefault()
  69. $page_item.mCustomScrollbar('scrollTo',['top',null]);
  70. });
  71. }
  72. }
  73. });
  74. $("#page-wrapper.blog").mCustomScrollbar({
  75. theme: "dark",
  76. scrollbarPosition: "outside",
  77. callbacks: {
  78. whileScrolling: function() {
  79. var pct = this.mcs.topPct;
  80. if ( ($page.hasClass('down')) ) {
  81. } else {
  82. $("#page-wrapper").addClass("down");
  83. $(this).mCustomScrollbar("disable",true);
  84. setTimeout(function(){
  85. console.log('time');
  86. $("#page-wrapper").mCustomScrollbar("update");
  87. }, 500);
  88. }
  89. }
  90. }
  91. });
  92. }
  93. function clickscroll() {
  94. var $btnscroll = $('.scroll');
  95. $btnscroll.on('click', function() {
  96. $page.addClass("down");
  97. })
  98. }
  99. jQuery(document).ready(function($) {
  100. masonry();
  101. filteritem();
  102. contact();
  103. customscroll();
  104. clickscroll();
  105. });