Dynamic

<!-- SCROLL TO TOP ON CLICK -->
<script src="https://cdn.jsdelivr.net/gh/CodeCrumbsApp/accordion@latest/index.min.js"></script>
<script>
  window.CodeCrumbs.ScrollTopOnClick({
    scrollTriggerSelectors: [".TRIGGER-BUTTON-CLASS"],
    windowScroll: true, // If false, will only scroll the scroll areas to top
    windowScrollToSelector: ".SCROLL-ANCHOR-CLASS", // Scroll to specific element rather than top of the page
    windowScrollOffset: 60, // Offset distance in pixels from element or window
    windowScrollDelay: 500, // Delay in milliseconds before starting scroll
    scrollAreas: [
		  {
			  selector: ".SCROLL-AREA-CLASS", // Class of element with "overflow: scroll"
			  offset: 0, // Distance in pixels from the top of the scroll area
		  },
	  ],
	  scrollAreaScrollDelay: 500, // Delay in milliseconds before starting scroll
  });
</script>

Quick Grab

Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.

Save to Favorites

Learn How to Use This

<!-- CODECRUMBS ACCORDION -->
<script src="https://cdn.jsdelivr.net/gh/CodeCrumbsApp/accordion@latest/index.min.js"></script>
<script>
  window.CodeCrumbs.Accordion({
    oneOpen: true,
    speed: 600,
    easing: 'cubic-bezier(0.55, 0, 0.1, 1)',
    repositionOpenItem: false,
    repositionDistance: 300,
    repositionDelay: 300,
    classNames: {
      accordion: 'cc-accordion',
      item: 'cc-accordion-item',
      head: 'cc-accordion-header',
      body: 'cc-accordion-body',
      icon: 'cc-accordion-icon',
    },
  })
</script>

Quick Grab

Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.

Save to Favorites

Learn How to Use This

<!-- DYNAMIC WEEKDAY --> 
<script>
  // for each .weekday element
  document.querySelectorAll('.weekday').forEach(weekday => {
    // get today's day
    const today = new Intl.DateTimeFormat('en', {weekday:'long'}).format(new Date());
    // set it as the current text
    weekday.textContent = today;
  });
</script>

Quick Grab

Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.

Save to Favorites

Learn How to Use This

<!-- Dynamic Copyright Year -->
<script>
  // For using a class to select multiple elements
  const yearElems = document.querySelectorAll(".year")

  yearElems.forEach((yearElem) => {
    yearElem.innerText = new Date().getFullYear()
  })
</script>

Quick Grab

Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.

Save to Favorites

Learn How to Use This

<!-- COUPON COPY TO CLIPBOARD --> 
<script>
  // change SAVE20NOW to whatever coupon or text you want to be copied
  $('.coupon-field').val('SAVE20NOW')
                    .prop('readOnly', true)
                    .css( 'cursor', 'text' );

  // on .copy-btn click
  $('.copy-btn').click(function(){
    // copy the .coupon-field's value
    copyToClipboard($('.coupon-field').val());

    // save the .copy-btn's original text
    const origText = $(this).text();
    // save the .copy-btn's original font color
    const origColor = $(this).css('color');

    // change the .copy-btn's text
    $(this).text('Copied! 🤙');
    // change the .copy-btn's font color
    $(this).css('color', '#1fbd41');

    setTimeout(()=>{ // after a 2 sec setTimeout
      $(this).text(origText); // reset text back to original
      $(this).css('color', origColor); // reset font color back to original
    }, 2000);
  });

  // define copyToClipboard function
  function copyToClipboard(str){
    // Create new element
    const el = document.createElement('textarea');
    // Set value (string to be copied)
    el.value = str;
    // Set non-editable to avoid focus and move outside of view
    el.setAttribute('readonly', '');
    el.style = {position: 'absolute', left: '-9999px'};
    document.body.appendChild(el);
    // Select text inside element
    el.select();
    // Copy text to clipboard
    document.execCommand('copy');
    // Remove temporary element
    document.body.removeChild(el);
  }
</script>

Quick Grab

Quickly copy and paste the code crumbs into your project. If you are not familiar with how this snippet works then click the button below to view the full snippet page.

Save to Favorites

Learn How to Use This

Dynamic

Know when new crumbs drop!

Want to contribute to the community?