Skip to content

Instantly share code, notes, and snippets.

View manuelcanga's full-sized avatar
🎯
Focusing

Manuel Canga manuelcanga

🎯
Focusing
View GitHub Profile
@manuelcanga
manuelcanga / index.html
Created January 7, 2022 19:14
Subida de imágenes con previo
<input type='file' onchange="previewImage(this, 'preview-image');" />
<img id="preview-image" src="http://placehold.it/300" alt="image preview" />
@manuelcanga
manuelcanga / index.html
Created January 7, 2022 19:17
Eliminar el label de "aún no se ha seleccionado ningún archivo"
<div>
<input type='file'/>
<span id='val'></span>
<span id='button'>Select File</span>
</div>
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:19
Cabecera flotante
/** Cambia de cabecera */
var trasweb = {};
trasweb.cabecera = function(slayer){
this.ALTURA_HACER_FLOTANTE_MENU = 400;
this.cabecera = document.getElementById(slayer);
this.getScroll = function () {
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:21
Detectar cambio de orientación móvil( JS )
trasweb.orientationchange = function() {
if(-90 === window.orientation || 90 === window.orientation ) {
alert("Landscape");
}else {
alert("portrait");
}
};
window.addEventListener('orientationchange', function() { trasweb.orientationchange(); } );
trasweb.orientationchange();
@manuelcanga
manuelcanga / jquery.js
Created January 7, 2022 19:23
Ajustar zoom al ancho de la pantalla (jquery / vanilla)
jQuery(document).ready(function($){
nsZoomZoom();
$( window ).resize(function() {
nsZoomZoom();
});
function nsZoomZoom() {
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:25
Lazy load de imágenes (con soporte responsive)
/**
Alternativa de menos de 1kb: https://apoorv.pro/lozad.js/demo/
*/
document.addEventListener('DOMContentLoaded', function () {
var bLazy = new Blazy({
src: 'data-src',
selector: '*[data-src]',
offset: 500,
breakpoints: [
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:26
Cambio de viewport según la orientación
/** Basado en: https://stackoverflow.com/questions/15040408/achieving-min-width-with-viewport-meta-tag */
document.addEventListener('DOMContentLoaded', function () {
trasweb.orientationchange();
});
trasweb.orientationchange = function (force_orientation) {
var vp = document.getElementById('viewport');
var orientation = window.orientation;
var is_desktop = document.body.classList.contains('desktop');
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:27
get position of an element in the web (js)
trasweb.getPosition = function (el) {
var xPos = 0;
var yPos = 0;
while (el) {
if (el.tagName === "BODY") {
// deal with browser quirks with body/window/document and page scroll
var xScroll = el.scrollLeft || document.documentElement.scrollLeft;
var yScroll = el.scrollTop || document.documentElement.scrollTop;
@manuelcanga
manuelcanga / scripts.js
Created January 7, 2022 19:27
get size of screen (js)
trasweb = trasweb | {};
trasweb.getSize = function () {
var w = window,
d = document,
e = d.documentElement,
g = d.getElementsByTagName('body')[0],
x = w.innerWidth || e.clientWidth || g.clientWidth,
y = w.innerHeight || e.clientHeight || g.clientHeight;