Fragmentos de código 2024, Diciembre

Obtenga todos los eventos DOM posibles - Trucos CSS

Obtenga todos los eventos DOM posibles - Trucos CSS

Puede obtener una matriz de todos los eventos que comienzan con "on" (por ejemplo, onclick) ejecutando esto en la consola de Firefox. .filter (función (i) (retorno "

Truncar cadena larga exactamente en el medio - Trucos CSS

Truncar cadena larga exactamente en el medio - Trucos CSS

Esto truncará una cadena más larga a una cadena más pequeña de longitud especificada (por ejemplo, el valor "25" en el código a continuación) mientras se reemplaza la parte central con "

Variables globales - Trucos CSS

Variables globales - Trucos CSS

Declarar variable fuera de la función ... var oneVariable; function setVariable () (oneVariable = "Variable set from within a function!";) function "

Truncar cadena por palabras - Trucos CSS

Truncar cadena por palabras - Trucos CSS

Técnica # 1 Técnica # 2 función limit_words ($ palabras, $ límite, $ append = '…') (// Suma 1 al límite especificado porque las matrices comienzan en 0 $ limit = "

Obtener variables de URL - Trucos CSS

Obtener variables de URL - Trucos CSS

Function getQueryVariable (variable) (var query = window.location.search.substring (1); var vars = query.split ("&"); for (var i = 0; i "

Función Time Ago - Trucos CSS

Función Time Ago - Trucos CSS

Esto se puede utilizar para comentarios y otras formas de comunicación para indicar la hora anterior en lugar de la hora exacta que podría no ser correcta para alguien en "

HtmlEntities para JavaScript - Trucos CSS

HtmlEntities para JavaScript - Trucos CSS

Htmlentities () es una función de PHP que convierte caracteres especiales (como <) en sus valores de escape / codificados (como <). Esto le permite mostrar "

Opciones para truncar cadenas - Trucos CSS

Opciones para truncar cadenas - Trucos CSS

Técnica # 1: Función simple myTruncate ($ string, $ limit, $ break = ".", $ Pad = "...") (if (strlen ($ string) "

Obtenga la clave de YouTube desde un enlace - Trucos CSS

Obtenga la clave de YouTube desde un enlace - Trucos CSS

Enlace de ejemplo: // Enlace de Youtube var youtubeLink = document.getElementById ('myLink'). Href; var youtubeVideoKey = "

Actualizar valores de toda la tabla - Trucos CSS

Actualizar valores de toda la tabla - Trucos CSS

Este código asume que está conectado a una base de datos MySQL que tiene una tabla con nombres y correos electrónicos. La idea es que generará una tabla de cada uno "

Botón "Volver" - Trucos CSS

Botón "Volver" - Trucos CSS

Los navegadores ya tienen botones "Atrás", así que es mejor que tengas una buena razón para poner uno en tu página. Botón de entrada con JavaScript en línea "

Validación de URL - Trucos CSS

Validación de URL - Trucos CSS

$ url = 'http://example.com'; $ validación = filter_var ($ url, FILTER_VALIDATE_URL, FILTER_FLAG_HOST_REQUIRED); if ($ validación) $ salida = 'URL adecuada'; "

Inyectar nuevas reglas CSS - Trucos CSS

Inyectar nuevas reglas CSS - Trucos CSS

Si necesita cambiar el estilo de un elemento con JavaScript, normalmente es mejor cambiar el nombre de una clase y tener el CSS ya en la página "

Probador de rango de código postal simple - Trucos CSS

Probador de rango de código postal simple - Trucos CSS

Esta expresión regular a continuación prueba el código postal proporcionado si comienza con los números 096 y si hay exactamente 2 números después. Si lo hace, hace eco Sí, si "

Inyectar HTML desde una cadena de HTML - Trucos CSS

Inyectar HTML desde una cadena de HTML - Trucos CSS

Digamos que tiene algo de HTML que es una cadena: let string_of_html = `

Cool
`; Tal vez provenga de una API o la haya construido usted mismo a partir de "

Números acolchados con cero - Trucos CSS

Números acolchados con cero - Trucos CSS

Function getZeroPaddedNumber ($ valor, $ padding) (return str_pad ($ valor, $ padding, "0", STR_PAD_LEFT);) Uso echo getZeroPaddedNumber (123, 4); // salidas "

Intervalos - Trucos CSS

Intervalos - Trucos CSS

Estándar No es necesario crear la variable, pero es una buena práctica, ya que puede usar esa variable con clearInterval para detener la ejecución actual "

Comprobación de tipo avanzada - Trucos CSS

Comprobación de tipo avanzada - Trucos CSS

Esta colección de funciones es para probar si el valor de una variable es de cierto tipo. Por ejemplo, ¿13rem es una longitud relativa? ¡CIERTO! Es "helada"

Entrada con imagen de fondo que desaparece - Trucos CSS

Entrada con imagen de fondo que desaparece - Trucos CSS

Esto replica la funcionalidad de los campos de búsqueda de Google integrables estándar. Tienen una imagen de fondo y cuando se hace clic en la entrada "

Funciones de opacidad en blanco y negro - Trucos CSS

Funciones de opacidad en blanco y negro - Trucos CSS

Es bastante común necesitar un poco de blanco o negro transparente. En CSS, puede hacer: .half-black (background: rgba (0, 0, 0, 0.5);) Se vuelve más fácil en "

La matriz de JavaScript contiene - Trucos CSS

La matriz de JavaScript contiene - Trucos CSS

Los objetos Javascript son realmente agradables, pero a veces les faltan algunas funciones / métodos útiles. El ejemplo anterior es con matrices. Es realmente"

Almacenamiento en caché del selector de corriente (&) en Sass - Trucos CSS

Almacenamiento en caché del selector de corriente (&) en Sass - Trucos CSS

El carácter & en Sass es único porque representa el selector actual. Cambia a medida que anida. Supongamos que está anidado, pero desea acceder a un "

JavaScript MD5 - Trucos CSS

JavaScript MD5 - Trucos CSS

Var MD5 = función (cadena) (función RotateLeft (lValue, iShiftBits) (return (lValue> (32-iShiftBits));) función AddUnsigned (lX, lY) (var "

BEM Mixins - Trucos CSS

BEM Mixins - Trucos CSS

La mejor introducción a BEM es de Harry Roberts: BEM, que significa bloque, elemento, modificador, es una metodología de nomenclatura de front-end ideada por los chicos de "

Obtener URL y partes de URL en JavaScript - Trucos CSS

Obtener URL y partes de URL en JavaScript - Trucos CSS

JavaScript puede acceder a la URL actual en partes. Para esta URL: https://css-tricks.com/example/index.html?s=flexbox window.location.protocol = "

Cubriendo Mixin - Trucos CSS

Cubriendo Mixin - Trucos CSS

Me encuentro usando estas propiedades juntas todo el tiempo, lo que suele ser una buena oportunidad para una abstracción como un mixin: @mixin coverer ("

Valor de KeyboardEvent (keyCodes, metaKey, etc.) - Trucos CSS

Valor de KeyboardEvent (keyCodes, metaKey, etc.) - Trucos CSS

Cuando se activa un KeyboardEvent, puede probar qué tecla se presionó porque ese evento contiene información sobre la que puede escribir lógica ".

Sujetar un número - Trucos CSS

Sujetar un número - Trucos CSS

En informática, usamos la palabra abrazadera como una forma de restringir un número entre otros dos números. Cuando se fija, un número mantendrá su propio valor "

Menú de pan de hamburguesa de Apple.com - Trucos CSS

Menú de pan de hamburguesa de Apple.com - Trucos CSS

Apple hizo algo de ruido cuando lanzaron un sitio actualizado, incluida una navegación receptiva completamente nueva. Si bien el rediseño se centró en otras cosas, una "

Recorrer la matriz sin desperdiciar búsquedas - Trucos CSS

Recorrer la matriz sin desperdiciar búsquedas - Trucos CSS

Encuentre la longitud de la matriz antes de usarla en la función for, por lo que no necesita contar la longitud de la matriz en cada iteración (asumiendo la longitud "