Skip to content

Instantly share code, notes, and snippets.

View YohannParis's full-sized avatar

Yohann Paris YohannParis

5 followers · 5 following
View GitHub Profile
@YohannParis
YohannParis / basic-sticky.js
Created December 13, 2016 19:58
Easy and quick way to add a sticky element.
var header = document.querySelector('.header');
var origOffsetY = header.offsetTop;
function onScroll(e) {
window.scrollY >= origOffsetY ? header.classList.add('sticky') :
header.classList.remove('sticky');
}
document.addEventListener('scroll', onScroll);
@YohannParis
YohannParis / SmoothScroll.js
Created August 16, 2016 20:50
Easy way to smoothscroll to an element — http://jsfiddle.net/DruwJ/1/
window.smoothScrollTo = (function () {
var timer, start, factor;
return function (target, duration) {
var offset = window.pageYOffset,
delta = target - window.pageYOffset; // Y-offset difference
duration = duration || 1000; // default 1 sec animation
start = Date.now(); // get start time
factor = 0;
@YohannParis
YohannParis / fluid-typography.less
Created May 11, 2016 19:05
.fluid-type(@property, @min-vw, @max-vw, @min-size, @max-size) {
@{property}: @min-size;
@media screen and (min-width: @min-vw) {
@{property}: calc( @min-size ~" + " unit(@max-size - @min-size) ~" * ((100vw - " @min-vw ~") /" unit(@max-vw - @min-vw) ~")" );
}
@media screen and (min-width: @max-vw) {
@{property}: @max-size;
@YohannParis
YohannParis / _html_entities.scss
Created March 29, 2016 16:10 — forked from apisandipas/_html_entities.scss
HTML Entities map - The pseudo-element 'content' property doesnt accept normal (») style HTML entities. These variables below easy the pain of looking up the HEX codes...
/**
* The pseudo-element 'content' property doesnt accept normal (») style
* HTML entities. These variables below easy the pain of looking up the HEX codes...
*
* Referenced from http://www.danshort.com/HTMLentities/
*
* TODO: Add all the other entities? Worth it? Some day? Maybe?
*/
// Punctuation
@YohannParis
YohannParis / ie-detection.js
Created March 10, 2016 20:23
// detect IE
var IEversion = detectIE();
if (IEversion !== false) {
document.getElementById('result').innerHTML = 'IE ' + IEversion;
} else {
document.getElementById('result').innerHTML = 'NOT IE';
}
// add details to debug result
@YohannParis
YohannParis / USA-map.html
Last active March 4, 2016 15:50
Map of the USA with states shortname
<!DOCTYPE html>
<html>
<head>
<title>Map of the USA, with States code</title>
<style type="text/css">
rect, path { fill: lime; }
rect { fill-opacity: 0; }
path {
@YohannParis
YohannParis / Contract Killer 3.md
Created March 25, 2014 16:27

Contract Killer

The popular open-source contract for web designers and developers by Stuff & Nonsense

  • Originally published: 23/12/2008
  • Revised date: 15/12/2013
  • Original post
@YohannParis
YohannParis / disqus_small.html
Created July 5, 2013 16:50
<!-- Smaller Disqus code - http://studioromeo.co.uk/suit-and-tie/ -->
<aside id="disqus_thread"></aside>
<script>
(function(d,t) {
var c=d.createElement(t);s=d.getElementsByTagName(t)[0];
c.async=1;c.src='http://[[YOURSITEID]].disqus.com/embed.js';
s.parentNode.insertBefore(c,s)})(document,'script');
</script>
@YohannParis
YohannParis / center.css
Created July 5, 2013 15:43
To horizontally and vertically center an element in css: http://css-tricks.com/centering-percentage-widthheight-elements/
/*
* To horizontally and vertically center an element in css:
* http://css-tricks.com/centering-percentage-widthheight-elements/
*/
.center {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
@YohannParis
YohannParis / mailto.txt
Created March 7, 2013 20:01
mailto command to send pre-filled emails
RFC 2368: http://www.ietf.org/rfc/rfc2368.txt
mailto:name@domain.com?subject=Header&body=This is the first line%0D%0AThis is the second
%0D%0A = line break.
%20 = space, not really needed.