View gist:cd26df98777b2fbadf8d148653975e94
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* This is full copy-paste for the Elementotr PRO's Custom Code. In case you use "Simple custom CSS and JS" plugin, | |
you'll have to separate the CSS from JS, and exclude the STYLE and SCRIPT tags */ | |
<style> | |
[data-hover-img] .img-floater { | |
position: absolute; | |
opacity: 0; | |
width: 400px; | |
height: 300px; | |
top: -310px; /* or... 150px to center it vertically */ |
View OoohBoi GSAP Teleporter
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
;( function() { | |
document.addEventListener( 'DOMContentLoaded', my_stuff ); | |
function my_stuff() { | |
let is_mobile = false; | |
let hero = document.querySelector( '#hero' ); |
View ob-show-more-show-less-gsap.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body:not(.elementor-editor-active) .ob-unfold .ob-content { overflow: hidden; height: 200px; } | |
body:not(.elementor-editor-active) .ob-unfold .ob-blanket { cursor: pointer; z-index: 100; } | |
/* If you plan to use variable initial heights... */ | |
/* | |
body:not(.elementor-editor-active) .ob-unfold .ob-content.ob-height-300 { height: 300px; } | |
body:not(.elementor-editor-active) .ob-unfold .ob-content.ob-height-toggle { height: 0px; } | |
*/ | |
/* don't forget to append these classes to your ob-content in Elementor !!! */ |
View ob-show-more-show-less-gsap.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
;( function() { | |
document.addEventListener( 'DOMContentLoaded', unfold_content ); | |
function unfold_content() { | |
let close_text = "Show Less"; | |
let the_unfolds = gsap.utils.toArray( '.ob-unfold' ); | |
the_unfolds.forEach( ( ob, i ) => { |
View Locomotive Scroll + ScrollTrigger
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
;(function() { | |
// locomotive scroll storage | |
var loco_scroll = {}; | |
// wait until sfe_loco_scroll available | |
var chck_if_sfe_loco_scroll_loaded = setInterval(function() { | |
if (window.sfe_loco_scroll && Object.keys(window.sfe_loco_scroll).length !== 0 && window.gsap && window.ScrollTrigger) { |
View Simple GSAP ScrollTrigger Test
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
;( function() { | |
// wait until gsap & ScrollTrigger available | |
let chck_if_gsap_loaded = setInterval( function() { | |
if( window.gsap && window.ScrollTrigger ) { | |
// register scrolTrigger | |
gsap.registerPlugin( ScrollTrigger ); |
View elementor-tips-tricks.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* | |
* Exclude & Include in group control | |
*/ | |
$this->add_group_control( | |
Group_Control_Background::get_type(), | |
[ | |
'name' => 'item_background', | |
'label' => __( 'Background', 'happy-addons-pro' ), | |
'types' => [ 'classic', 'gradient' ], |
View gist:a2e47433443125887d20aafd5cec7388
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* be sure to copy-paste to the Image Widget Custom CSS panel */ | |
selector, | |
selector .elementor-widget-container, | |
selector .elementor-image, | |
selector .elementor-image > a { | |
height: 100%; | |
} | |
selector .elementor-image img { | |
object-fit: cover; | |
object-position: 50% 50%; |
View gist:b25f29433421f353e8d365e46a9d8f71
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* EXAMPLE GRADIENTS */ | |
/* To be used with Heading widget */ | |
selector .elementor-heading-title { | |
background-image: linear-gradient(to right top, #ec2551, #c52a6e, #943979, #633e71, #3d3a59); | |
background-clip: text; | |
-webkit-background-clip: text; | |
} | |
/* To be used with Text Editor widget */ |
View gist:5d1f00ee8362292dba0af27700b05d74
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* MAGICAL CSS Rule */ | |
selector .elementor-container .elementor-row { | |
flex-wrap: wrap; | |
/* uncomment for columns alignment */ | |
/* justify-content: center; */ | |
} | |
/* Responsive Columns Alignment - Tablet */ | |
@media (min-width: 768px) and (max-width: 1024px) { | |
selector .elementor-container .elementor-row { |
NewerOlder