Skip to content

Instantly share code, notes, and snippets.

View AitorAlejandro's full-sized avatar

Aitor Alejandro Herrera AitorAlejandro

View GitHub Profile
@AitorAlejandro
AitorAlejandro / hiddenStructure.css
Created May 1, 2015 13:11
Oculta HTML pero no para los lectores de pantalla. - Utilizado en la web de la ONCE
hiddenStructure{
display: block;
background: transparent;
background-image: none;
border: none;
height: 1px;
overflow: hidden;
padding: 0;
margin: -1px 0 0 -1px;
width: 1px;
@AitorAlejandro
AitorAlejandro / degradadoGrisCookies.css
Last active August 29, 2015 14:21
Degradado gris. Útil para una capa de aviso de cookies.
.degradadoGrisCookie{
background: #bbbbbb; /* Old browsers */
background: -moz-linear-gradient(top, #e1e1e1 0%, #adadad 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e1e1e1), color-stop(100%,#adadad)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #e1e1e1 0%,#adadad 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #e1e1e1 0%,#adadad 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #e1e1e1 0%,#adadad 100%); /* IE10+ */
background: linear-gradient(to bottom, #e1e1e1 0%,#adadad 100%); /* W3C */
}
@AitorAlejandro
AitorAlejandro / modosbootstrap.js
Created May 19, 2015 11:42
Detectar las media-query de Bootstrap por JavaScript
$(window).bind("resize", function () {
if ($(window).width() < 768) {
// extra small
$("#modo").text("Modo activo: Extra Small");
}
else if ($(window).width() > 768 && $(window).width() <= 992) {
// small
$("#modo").text("Modo activo: Small");
}
else if ($(window).width() > 992 && $(window).width() <= 1200) {
@AitorAlejandro
AitorAlejandro / js-soloNumeros-coma.js
Last active August 29, 2015 14:21
Permitir números y una sóla coma - jQuery dependencia
$('.js-soloNumeros-coma').keydown(function(event){
//Permite números y una sola coma
var bYaHayComa = $(this).val().indexOf(',') < 0 ? false : true;
// Permitir: backspace, delete, tab, escape, y enter
if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 ||
event.keyCode == 27 || event.keyCode == 13 || (event.keyCode == 188 && !bYaHayComa) ||//coma
// Permitir: Ctrl+A, Ctrl+C, Ctrl+V y Ctrl+X
(event.keyCode == 65 && event.ctrlKey === true) ||
(event.keyCode == 67 && event.ctrlKey === true) ||
(event.keyCode == 86 && event.ctrlKey === true) ||
@AitorAlejandro
AitorAlejandro / Lista de definicion vertical.markdown
Last active August 29, 2015 14:22
Lista de definicion vertical

Lista de definicion vertical

Estilo en columna para lista de definición vertical a una columna. De inspiracion de National Geographic. Dependencia: Bootstrap 3 + Google Fonts para 'PT Sans Narrow'

A Pen by Aitor Alejandro on CodePen.

License.

@AitorAlejandro
AitorAlejandro / iframes.js
Last active August 29, 2015 14:22
Librería para trabajar con iframes cuando son del mismo dominio
/* *** iframes *** */
/* Mini-libreria que resuelve las acciones mas comunes con iframes */
/* siempre que los iframes sean del mismo dominio */
function getIframe(iframeElement){
//devuelve el document de un iframe
return iframeElement.contentDocument;
}
//uso
var innerdoc = getIframe( document.getElementById('iframe_id') );
@AitorAlejandro
AitorAlejandro / js-soloNumeros.js
Created June 19, 2015 08:43
Permitir sólo números - jQuery dependencia
$('.js-soloNumeros').keydown(function(event){
// Permitir: backspace, delete, tab, escape, y enter
if ( event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 ||
event.keyCode == 27 || event.keyCode == 13 ||
// Permitir: Ctrl+A, Ctrl+C, Ctrl+V y Ctrl+X
(event.keyCode == 65 && event.ctrlKey === true) ||
(event.keyCode == 67 && event.ctrlKey === true) ||
(event.keyCode == 86 && event.ctrlKey === true) ||
(event.keyCode == 88 && event.ctrlKey === true) ||
// Permitir: inicio, fin, left, right
@AitorAlejandro
AitorAlejandro / faviconAndTiles.html
Created July 3, 2015 10:12
Cómo implementar tu favicon al completo
<!-- begin of favico -->
<!-- ?v=xxx es para evitar el cacheo de los navegadores, si cambiamos alguna imagen incluiremos una nueva versión -->
<link href="/img/icons/favicon.ico?v=111" rel="icon"/>
<link rel="shortcut icon" href="/img/icons/favicon.ico?v=111" />
<!-- apple -->
<link rel="apple-touch-icon-precomposed" href="/img/icons/apple-touch-icon-57x57.png?v=111" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/img/icons/apple-touch-icon-72x72.png?v=111"/>
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/img/icons/apple-touch-icon-114x114.png?v=111" />
<link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-57x57.png?v=111" />
@AitorAlejandro
AitorAlejandro / sombrasInternas.css
Last active August 29, 2015 14:24
Sombras internas arriba y abajo
.inner-top-shadow{
-webkit-box-shadow: inset 0 20px 20px -20px #dbdbdb;
-moz-box-shadow: inset 0 20px 20px -20px #dbdbdb;
box-shadow: inset 0 20px 20px -20px #dbdbdb;}
.inner-bottom-shadow{
-webkit-box-shadow: inset 0 -20px 20px -20px #dbdbdb;
-moz-box-shadow: inset 0 -20px 20px -20px #dbdbdb;
box-shadow: inset 0 -20px 20px -20px #dbdbdb;}
@AitorAlejandro
AitorAlejandro / cargaScript.js
Created July 20, 2015 08:14
Carga de Scripts dinámicamente
function cargarScript(sRutaScript,callback){
var elemScript=document.createElement("script");
elemScript.type="text/javascript";
if( elemScript.readyState ){
elemScript.onreadystatechange=function(){
if( elemScript.reareadyState === "loaded" || elemScript.reareadyState === "complete"){
elemScript.onreadystatechange=null;
callback();
}
}