Tilt Effect JS

elem = document.getElementsByClassName(‘uk-background-norepeat’); window.addEventListener(‘deviceorientation’, function(e){ handler(e); }, false); function handler(e){ var width = window.outerWidth, rot = e.gamma / 1800, left = ( width / 2 ) * rot; elem[0].style.backgroundPosition = left + ‘px’; }Continue reading

Buttons Material Design JS

‘use strict’; var rippleEffect = function (e) { var target = e.target; var rect = target.getBoundingClientRect(); var ripple = target.querySelector(‘.ripple’); jQuery(ripple).remove(); ripple = document.createElement(‘span’); ripple.className = ‘ripple’; ripple.style.height = ripple.style.width = Math.max(rect.width, rect.height) + ‘px’; target.appendChild(ripple); var top = e.pageY…Continue reading

Form Labels CSS

:root { –transitionDuration: 250ms; –transitionTF: cubic-bezier(0.145, 0.045, 0.355, 1); /* floated labels */ –inputPaddingV: var(–gutterMd); –inputPaddingH: var(–gutterLg); –inputFontSize: var(–fontSizeLg); –inputLineHeight: var(–lineHeightMd); –labelScaleFactor: 0.2; –labelDefaultPosY: 50%; –labelTransformedPosY: calc( (var(–labelDefaultPosY)) – (var(–inputPaddingV) * var(–labelScaleFactor)) – (var(–inputFontSize) * var(–inputLineHeight)) ); –inputTransitionDuration: var(–transitionDuration); –inputTransitionTF:…Continue reading

Highlight Button on Scroll for Active Section on Vendor Pages

document.addEventListener(“DOMContentLoaded”, function() { var galleryButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-fadf404 .elementor-button”); var realWeddingsButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-5de19ff .elementor-button”); var faqButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-4cc0a6c .elementor-button”); var aboutButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-354b71e.elementor-element”); var locationsButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-9840650.elementor-element”); var specialtyButton = document.querySelector(“.elementor-81101 .elementor-element.elementor-element-dabc0f3.elementor-element”); var stickyMenu = document.querySelector(“.elementor-81101…Continue reading

Vendor (JS): Hide Empty Fields & Add Link Attributes on Vendor Post Pages

// Hide empty phone, specialty, social media, real wedding and FAQ elements document.addEventListener(‘DOMContentLoaded’, function() { var phoneField = document.getElementById(‘phone-field’); var phoneContainer = document.getElementById(‘phone-container’); var specialtyValue = document.getElementById(‘specialty-value’); var specialtySection = document.getElementById(‘specialty-section’); var specialtyButton = document.getElementById(‘specialty-button’); var socialIcons = document.querySelectorAll(‘.elementor-social-icon’); var…Continue reading

Hide Empty Fields & Add Link Attributes on Vendor Post Pages

// Hide empty phone, specialty, social media, real wedding and FAQ elements document.addEventListener(‘DOMContentLoaded’, function() { var phoneField = document.getElementById(‘phone-field’); var phoneContainer = document.getElementById(‘phone-container’); var specialtyValue = document.getElementById(‘specialty-value’); var specialtySection = document.getElementById(‘specialty-section’); var specialtyButton = document.getElementById(‘specialty-button’); var socialIcons = document.querySelectorAll(‘.elementor-social-icon’); var…Continue reading

Hide Empty Fields & Add Link Attributes on Vendor Post Pages

// Hide empty phone, specialty, social media, real wedding and FAQ elements document.addEventListener(‘DOMContentLoaded’, function() { var phoneField = document.getElementById(‘phone-field’); var phoneContainer = document.getElementById(‘phone-container’); var specialtyValue = document.getElementById(‘specialty-value’); var specialtySection = document.getElementById(‘specialty-section’); var specialtyButton = document.getElementById(‘specialty-button’); var socialIcons = document.querySelectorAll(‘.elementor-social-icon’); var…Continue reading