Diego Fernando Díaz A. dedosmedia
dedosmedia
/ css_borde_botones.css
Last active
February 24, 2016 04:13
CSS: Efecto de Borde para Feedback en Botones. Wrong, Ok, Normal
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .border{ | |
| -webkit-border-radius: 10px; | |
| -moz-border-radius: 10px; | |
| border-radius: 10px; | |
| border:solid 5px #EFB20F; | |
| } | |
| .border.wrong{ | |
| border: solid 5px #E11C24 !important; | |
| } |
dedosmedia
/ css_texto_centrado_boton.css
Last active
February 18, 2016 04:34
Centra el texto de un label, segun el tamaño del div que lo contiene
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #interactive label#text { | |
| width: 210px; | |
| display: table-cell; | |
| text-align: center; | |
| vertical-align: middle; | |
| cursor: pointer; | |
| } | |
| .contenedor{ | |
| display: table; |
dedosmedia
/ css_image_centered_on_div.css
Last active
February 18, 2016 04:36
Centra una imagen vertical y horizontal en el div que la contiene
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| img.centered { | |
| position: absolute; | |
| margin: auto; | |
| top: 0px; | |
| left: 0px; | |
| bottom: 0; | |
| right: 0; | |
| } |
dedosmedia
/ css_autosize_imagen_on_div.css
Last active
February 18, 2016 04:37
Autodiensiona una imagen al tamaño del div que la contiene
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| img.autosize | |
| { | |
| width: 100%; | |
| } |
dedosmedia
/ css_borde_transparente_y_seleccionado.css
Last active
February 22, 2016 12:32
Aplicar un borde de color alrededor de la imagen
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .border.transparent{ | |
| border: solid 5px transparent; | |
| -webkit-border-radius: 10px; | |
| -moz-border-radius: 10px; | |
| border-radius: 10px; | |
| } | |
| .border{ | |
| -webkit-border-radius: 10px; | |
| -moz-border-radius: 10px; |
dedosmedia
/ js_replace_all_characters.js
Last active
March 10, 2016 18:34
Reemplaza todas las ocurrencias del substring indicado
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var re = new RegExp("e","g"); | |
| var str = ("cadena donde reemplazar").replace(re,"o"); | |
| //cadona dondo roomplazar | |
| // Alternativamente | |
| var cadena = "cadena con texto" | |
| var new_string = "texto" | |
| var str = cadena.substring(0,cadena.lastIndexOf(new_string))+"<span class='green'>"+new_string+"</span>"; |
dedosmedia
/ SNIPPET_ botones con texto y bordes
Last active
February 26, 2016 23:39
Botones con texto e imagenes centradas, para las opciones
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| En el index.html (agregar uno por cada botòn, y personalizar id) | |
| <div class="selectable option" id="option0"> | |
| <label class="text">EJEMPLO</label> | |
| </div> | |
| En style_custom.css (personalizar background-image, width y height acorde a la imagen a usar, y las posiciones left y top de cada opción) | |
| .option | |
| { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #canvas { | |
| position: absolute; | |
| z-index: 500; | |
| left: 183px; | |
| top: 329px; | |
| -moz-transform: scale(-1, 1); | |
| -webkit-transform: scale(-1, 1); | |
| -o-transform: scale(-1, 1); | |
| transform: scale(-1, 1); | |
| filter: FlipH; |
dedosmedia
/ js_removeClass_prefix.js
Last active
March 2, 2016 01:52
JS: RemoveClass con un prefijo
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $el.removeClass(function(index,classes){ | |
| var matches = classes.match(/drop-\d+/); // some-class-somenumber | |
| return (matches) ? matches.join(' ') : ''; | |
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <audio id="s0"> | |
| <source src="audio/s0.mp3" type="audio/mpeg"> | |
| Your browser does not support the audio element. | |
| </audio> | |
| <audio id="s1"> | |
| <source src="audio/s1.mp3" type="audio/mpeg"> | |
| Your browser does not support the audio element. | |
| </audio> |
OlderNewer