Personal portfolio website created with bootstrap.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

75 lines
2.3 KiB

  1. (function($) {
  2. "use strict"; // Start of use strict
  3. // Smooth scrolling using jQuery easing
  4. $('a.js-scroll-trigger[href*="#"]:not([href="#"])').click(function() {
  5. if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
  6. var target = $(this.hash);
  7. target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
  8. if (target.length) {
  9. $('html, body').animate({
  10. scrollTop: (target.offset().top - 70)
  11. }, 1000, "easeInOutExpo");
  12. return false;
  13. }
  14. }
  15. });
  16. // Scroll to top button appear
  17. $(document).scroll(function() {
  18. var scrollDistance = $(this).scrollTop();
  19. if (scrollDistance > 100) {
  20. $('.scroll-to-top').fadeIn();
  21. } else {
  22. $('.scroll-to-top').fadeOut();
  23. }
  24. });
  25. // Closes responsive menu when a scroll trigger link is clicked
  26. $('.js-scroll-trigger').click(function() {
  27. $('.navbar-collapse').collapse('hide');
  28. });
  29. // Activate scrollspy to add active class to navbar items on scroll
  30. $('body').scrollspy({
  31. target: '#mainNav',
  32. offset: 80
  33. });
  34. // Collapse Navbar
  35. var navbarCollapse = function() {
  36. if ($("#mainNav").offset().top > 100) {
  37. $("#mainNav").addClass("navbar-shrink");
  38. } else {
  39. $("#mainNav").removeClass("navbar-shrink");
  40. }
  41. };
  42. // Collapse now if page is not at top
  43. navbarCollapse();
  44. // Collapse the navbar when page is scrolled
  45. $(window).scroll(navbarCollapse);
  46. // Modal popup$(function () {
  47. $('.portfolio-item').magnificPopup({
  48. type: 'inline',
  49. preloader: false,
  50. focus: '#username',
  51. modal: true
  52. });
  53. $(document).on('click', '.portfolio-modal-dismiss', function(e) {
  54. e.preventDefault();
  55. $.magnificPopup.close();
  56. });
  57. // Floating label headings for the contact form
  58. $(function() {
  59. $("body").on("input propertychange", ".floating-label-form-group", function(e) {
  60. $(this).toggleClass("floating-label-form-group-with-value", !!$(e.target).val());
  61. }).on("focus", ".floating-label-form-group", function() {
  62. $(this).addClass("floating-label-form-group-with-focus");
  63. }).on("blur", ".floating-label-form-group", function() {
  64. $(this).removeClass("floating-label-form-group-with-focus");
  65. });
  66. });
  67. })(jQuery); // End of use strict