Skip to content

Instantly share code, notes, and snippets.

View aliboy08's full-sized avatar

Alistair Ponce aliboy08

2 followers · 1 following
  • Philippines
View GitHub Profile
@aliboy08
aliboy08 / get-load-progress.js
Created December 24, 2022 07:56
get load progress
const perf = window.performance;
if( perf ) {
var load_progress_interval = setInterval(function(){
var resources = perf.getEntriesByType("resource");
var resources_total = resources.length
var resources_loaded = resources.filter(entry => entry.duration > 0).length;
var load_progress = (resources_loaded / resources_total) * 100;
console.log({ resources_loaded, load_progress });
}, 200);
window.onload = function() {
@aliboy08
aliboy08 / burger-animation.html
Created December 24, 2022 05:53
burger animation svg + css + js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Burger animation</title>
<style>
.burger {
width: 50px;
@aliboy08
aliboy08 / load-more-items.js
Last active December 23, 2022 06:49
load more items + animation
(function($){$(function(){
if( window.frameElement && window.frameElement.id == 'elementor-preview-iframe' ) return;
var num = 12;
var container = $('.categories-list');
var items = container.find('.elementor-icon-list-item');
var item_index = 0;
var interval = 190;
if( items.length < num ) return;
@aliboy08
aliboy08 / get-element-scroll-percentage.js
Last active December 22, 2022 13:14
get element scroll percentage
var el = document.querySelector('.el');
document.addEventListener('scroll', function(){
var el_scroll_percent = (window.pageYOffset + window.innerHeight - el.offsetTop) / el.offsetHeight * 1;
// 0 = on screen tip of element; 1 = on screen all
console.log(el_scroll_percent);
});
@aliboy08
aliboy08 / on-page-load-complete.js
Created December 21, 2022 00:54
on page load complete
var load_complete = false;
function on_page_load(){
if( load_complete ) return;
load_complete = true;
// scripts here ...
}
document.onreadystatechange = function(){
if( document.readyState === 'complete' ) {
on_page_load();
@aliboy08
aliboy08 / sample-produt-schema.php
Created December 9, 2022 04:12
sample product schema
<?php
$id = get_the_ID();
$name = get_the_title();
$description = get_post_meta( $id, '_yoast_wpseo_metadesc', true );
if( !$description ) {
$description = get_the_excerpt( $id );
}
$schema = [
@aliboy08
aliboy08 / pause-videos-off-screen.js
Last active December 6, 2022 02:55
pause videos off screen - intersection observer
function pause_videos_off_screen() {
if( typeof IntersectionObserver === 'undefined' ) return;
let videos = document.querySelectorAll("video");
videos.forEach((video) => {
if( !video.muted ) return;
if( !video.paused ) video.pause();
video.io = observer = new IntersectionObserver(
(entries) => {
entries.forEach((entry) => {
if ( entry.isIntersecting ) {
@aliboy08
aliboy08 / videos-on-off-screen-play-pause.js
Created December 6, 2022 02:00
videos on / off screen - play / pause
function videos_offscreen_pause(){
// pause if videos are off screen - to improve performance
var videos = $('video');
videos.each(function(){
var el = this;
el.pause();
var st_args = {
trigger: el,
markers: true,
onEnter: function(){
@aliboy08
aliboy08 / youtube-on-off-screen-play-pause.js
Created December 6, 2022 01:48
youtube on / off screen - play / pause
$('.horizontal_scroll_sections .elementor-widget-video').each(function(){
// i++;
var el = this;
var $el = $(el);
// var id = 'video-'+ i;
var iframe_vid;
var st_args = {
trigger: el,
@aliboy08
aliboy08 / woo-checkout-validate-phone.php
Created December 5, 2022 07:57
woo-checkout-validate-phone
add_action( 'woocommerce_after_checkout_validation', function( $fields, $errors ){
ff_phone_number_validation( $fields, $errors );
}, 10, 2 );
function ff_phone_number_validation( $fields, $errors ){
if( isset($errors->errors['billing_phone_validation']) || isset( $errors->errors['billing_phone_required'] ) ) {
return; // already validated
}