Skip to content

Instantly share code, notes, and snippets.

@malachi358
malachi358 / Image Upload HTML5 Preview
Created September 17, 2015 02:56
Image Upload HTML5 Preview
<img id="preview" src="placeholder.png" height="100px" width="100px" />
<input type="file" name="image" onchange="previewImage(this)" accept="image/*"/>
<script type="text/javascript">
function previewImage(input) {
var preview = document.getElementById('preview');
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
preview.setAttribute('src', e.target.result);
}
@malachi358
malachi358 / CSS Google Shadow Mask
Created October 20, 2015 10:17
CSS Google Shadow Mask
._GAp ._GAU1 {
background: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.2)),to(rgba(0,0,0,0)));
-webkit-mask-box-image: -webkit-gradient(linear,left top,right top,color-stop(0.0,rgba(0,0,0,0)),color-stop(0.5,rgba(0,0,0,.8)),color-stop(1.0,rgba(0,0,0,0)));
border-top: 1px solid rgba(0,0,0,0.4);
height: 8px;
opacity: 0;
position: absolute;
width: 100%;
z-index: 300;
}
@malachi358
malachi358 / CSS Outline technique
Created December 30, 2015 19:27
CSS Outline technique
.sidebar-nav li a span:last-child {
font-size: 28px;
position: absolute;
top: 25%;
right: 10px;
width: 50px;
text-align: center;
color: rgb(88, 88, 88);
text-shadow: 0px 0px 0px white,1px 1px 0px white,-1px -1px 0px white,1px -1px 0px white,-1px 1px 0px white;
}
@malachi358
malachi358 / Nivo - Lighbox play vimeo autoplay
Created June 2, 2016 14:15
Nivo - Lighbox play vimeo autoplay
$('.TESTER123').nivoLightbox({
afterShowLightbox: function(){
var src = $('.nivo-lightbox-content > iframe').attr('src');
$('.nivo-lightbox-content > iframe').attr('src', src + '?autoplay=1');
}
});
@malachi358
malachi358 / Nivo - Lighbox play vimeo autoplay
Created June 2, 2016 14:15
Nivo - Lighbox play vimeo autoplay
$('.TESTER123').nivoLightbox({
afterShowLightbox: function(){
var src = $('.nivo-lightbox-content > iframe').attr('src');
$('.nivo-lightbox-content > iframe').attr('src', src + '?autoplay=1');
}
});
@malachi358
malachi358 / Fly to Cart Jquery
Created September 13, 2016 20:40
Fly to Cart Jquery
// ADD TO CART IMAGE ANIMATION (FLY TO CART) -- COOL -- //
$cart = $('span.glyphicon-shopping-cart');
/* get details about the cart div */
var t = $cart.offset().top;
var l = $cart.offset().left;
var w = parseInt($cart.css('width').replace('px',''));
var h = parseInt($cart.css('height').replace('px',''));
var vCenter = (t+h)/2; // vertical center of cart div
var hCenter = (l+w)/2; // horizontal center of cart div
$('.add-to-cart-button').on('click',function(e){
@malachi358
malachi358 / Add Div Class based on url
Created October 3, 2016 18:41
Add Div Class based on url
/* Malachi Added Code Below */
// Collection Link Disable ==> //
$(document).ready(function() {
$('a[href="/collections"]').on('click', function() {
return false;
});
/*$(function() {
var loc = window.location.href; // returns the full URL
@malachi358
malachi358 / Change place of divs in dom based on width of device
Created December 6, 2016 00:43
Change place of divs in dom based on width of device
// Change place of divs in dom based on width of device ================================
$(window).resize(function(){
resize();
});
$(document).ready(function(){
resize();
});
function resize(){
@malachi358
malachi358 / ShopifyNewTemplate.liquid
Created March 31, 2017 00:03
Shopify New Template
<div class="content-wrapper">
{% if template == 'index' %}
{{ content_for_layout }}
{% elsif template == 'page.aboutus' %}
{{ content_for_layout }}
{% else %}
<div id="content" class="row">
{% if settings.breadcrumb %}
{% include 'breadcrumb' %}
{% endif %}
@malachi358
malachi358 / npm-link-permission-denied-after-build-babel.sh
Created November 20, 2018 03:49 — forked from ollelauribostrom/npm-link-permission-denied-after-build-babel.sh
Simple fix to permission denied error when using babel to transpile ES6 code during development of npm package / node module / cli