Skip to content

Instantly share code, notes, and snippets.

View lucasromerodb's full-sized avatar
👻
Boo!

Luke ✨ lucasromerodb

👻
Boo!
View GitHub Profile
.plinth
display: block
width: 0
height: 0
border-style: solid
&.p-hero
position: absolute
z-index: 50
bottom: 0
@lucasromerodb
lucasromerodb / loader.html
Created February 16, 2017 16:33
Estructura de loader html
<!-- LOADING "loader": si sumamos la clase "is-visible" se activara el loading (ex: class="loader is-visible") -->
<div class="loader">
<div class="loader__block">
<img src="img/icons/loader--white.svg" alt="" class="loader__icon">
<span class="loader__text">Cargando</span>
</div>
</div>
@lucasromerodb
lucasromerodb / onload_base64_1x1px.html
Created February 14, 2017 16:53
Es una imagen embebida en Base64 de un .png de 1px * 1px de 92 bytes (Mas info: https://www.base64-image.de/)
<!-- NOTE: On load trick --><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQIW2NgYAAAAAMAAdzsfUgAAAAASUVORK5CYII=" style="display:block;visibility:hidden;width:0;height:0" onload="myFunction()">
@lucasromerodb
lucasromerodb / Auto-Size float boxes
Last active August 29, 2015 14:17
When you add some elements, this auto resize the boxes dividing 100% (width) by amount of this.
HTML Before
<div class="boxes">
<div></div>
<div></div>
<div></div>
</div>
$(document).ready(function(){
var multiBox = $('.boxes div').size();