Skip to content

Instantly share code, notes, and snippets.

View haroldao's full-sized avatar
🎯
Design + Dev

Harold AO haroldao

🎯
Design + Dev
View GitHub Profile
@haroldao
haroldao / external-link.liquid
Created September 11, 2022 01:45
Shopify liquid - Know if a link is an external link
@haroldao
haroldao / is_touch_device.js
Created November 9, 2021 12:32
Check if is touch device
function is_touch_device() {
return 'ontouchstart' in window // works on most browsers
|| 'onmsgesturechange' in window; // works on ie10
};
@haroldao
haroldao / real-viewport.js
Created September 9, 2021 11:05
Real Viewport (No more issues with the 100vh in mobile browsers)
/* Vh Calc */
// First we get the viewport height and we multiple it by 1% to get a value for a vh unit
let vh = window.innerHeight * 0.01;
// Then we set the value in the --vh custom property to the root of the document
document.documentElement.style.setProperty('--vh', `${vh}px`);
window.setTimeout(() => {
let vh = window.innerHeight * 0.01;
document.documentElement.style.setProperty('--vh', `${vh}px`);
}, 1000);
@haroldao
haroldao / functions.scss
Created July 9, 2021 16:02
px to em/rem | SCSS
// Source: https://css-tricks.com/snippets/sass/px-to-em-functions/
@function rem($pixels, $context: 16) {
@return (math.div($pixels, $context)) * 1rem;
}
// check device
let isMobile = false;
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
isMobile = true;
document.body.classList.add('is-mobile');
}
<HTML>
<HEAD>
<!-- anti-flicker snippet (recommended) -->
<style>.async-hide { opacity: 0 !important} </style>
<script>(function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date;
h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')};
(a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c;
})(window,document.documentElement,'async-hide','dataLayer',4000,
{'CONTAINER_ID':true});</script>
function checkBrowserVersion() {
var objappVersion = navigator.appVersion;
var objAgent = navigator.userAgent;
var objbrowserName = navigator.appName;
var objfullVersion = ''+parseFloat(navigator.appVersion);
var objBrMajorVersion = parseInt(navigator.appVersion,10);
var objOffsetName,objOffsetVersion,ix;
// In Chrome
if ((objOffsetVersion=objAgent.indexOf("Chrome"))!=-1) {
function confetti(){
'use strict';
var onlyOnKonami = false;
$(function() {
// Globals
var $window = $(window)
, random = Math.random
<!-- Disable keyboard keys -->
<script>
document.onkeydown = function(e) {
return false;
}
</script>
<!-- Disable images drag -->
<script>
window.ondragstart = function() {