Snippets Collections
h1 {
  background: linear-gradient(180deg, rgba(255,255,255,0) 65%, #FFD0AE 65%);
  display: inline; font-weight: normal;
}
/*CSS*/
#nav__wrapper {
  transform: translateY(0%);
  transition: all 0.3s ease-out;
}

#nav__wrapper.header_hide {
  transform: translateY(-100%);
}
/*CSS*/
  
/*JS*/
const header_el = $("#nav__wrapper"),
    mywindow = $(window);
let mypos = mywindow.scrollTop(),
    up = !1,
    newscroll = 0;
mywindow.scroll(function () {
    (newscroll = mywindow.scrollTop()) > mypos && !up ? (header_el.toggleClass("header_hide"), (up = !up)) : newscroll < mypos && up && (header_el.toggleClass("header_hide"), (up = !up)), (mypos = newscroll);
});
/*JS*/
/* ----------------------------------------
Note: any modifications to these styles will be global 
---------------------------------------- */
.tippy-box {}
.tippy-content {}
.tippy-arrow {}

/* ----------------------------------------
You can also apply tooltip css overrides on the INTERIOR of your tooltips. Note: results may sometimes be unpredictable 😡
---------------------------------------- */
.tippy-box .style1 {
  font-family: courier;
  color: #0066FF;
  padding: 15px;
  display: inline-block;
}
<!-- jQuery -->
<script src="//code.jquery.com/jquery-latest.js"></script>
<!-- Popper -->
<script src="https://unpkg.com/@popperjs/core@2"></script>
<!-- Tippy -->
<script src="https://unpkg.com/tippy.js@6"></script>

<script language="javascript">
// This code will execute as soon as the document is loaded 
$(document).ready(function() {
    // Allow or disallow html in tooltips (default = false)
    tippy.setDefaultProps({allowHTML: true}); 
    // Transform elements
    let tooltip_elements = $('a[href^="#tooltip_"]');
    tooltip_elements.each(function(i){
        let link = $(this).attr('href');
        let tip = link.replace('#tooltip_', '');
        $(this).attr('data-tippy-content', tip);
        if (link.startsWith('#tooltip_')) {
          $(this).removeAttr('href').css('cursor', 'pointer');
        }
    });
    // Finally, call `tippy`
    tippy('[data-tippy-content]');
});</script>
/* REMOVE UNDERLINE FROM LINKS IN HEADER */
header a {
background-image: none !important;
}
/* ---- END ---- */
star

Mon Mar 21 2022 08:10:56 GMT+0000 (UTC) https://www.beatrizcaraballo.com/blog/low-highlight-heading-links-squarespace

#highlight #low #text #header
star

Sun Mar 20 2022 17:07:22 GMT+0000 (UTC) https://agency-website-c0d1e7.webflow.io/

#css #js #header #navbar #scroll-animation
star

Fri Dec 17 2021 08:12:32 GMT+0000 (UTC) https://www.ben-willenbring.com/willenblog/adding-tooltips-on-squarespace-with-popperjs

#tooltip #info #header #java
star

Fri Dec 17 2021 08:12:01 GMT+0000 (UTC) https://www.ben-willenbring.com/willenblog/adding-tooltips-on-squarespace-with-popperjs

#tooltip #info #header #java
star

Sun Nov 07 2021 14:41:59 GMT+0000 (UTC) https://www.rebeccagracedesigns.com/blog/remove-underline-from-links

#squarespace #hyperlinks #header

Save snippets that work with our extensions

Available in the Chrome Web Store Get Firefox Add-on Get VS Code extension