Skip to content
View jasubal's full-sized avatar

Block or report jasubal

Block user

Prevent this user from interacting with your repositories and sending you notifications. Learn more about blocking users.

You must be logged in to block users.

Please don't include any personal information such as legal names or email addresses. Maximum 100 characters, markdown supported. This note will be visible to only you.
Report abuse

Contact GitHub support about this user’s behavior. Learn more about reporting abuse.

Report abuse

Pinned Loading

  1. CSS Media queries em/psx equivalences CSS Media queries em/psx equivalences
    1
    /* MEDIA QUERIES EM/PX with base 1em=16px */
    2
    /* https://www.w3schools.com/tags/ref_pxtoemconversion.asp */
    3
    /*
    4
    xs  = 360px  - 600px,  ( 22.5em = 360px )
    5
    sm  = 600px  - 900px,  ( 37.5em = 600px / 50em = 800px )
  2. JS Optimized Scroll detector JS Optimized Scroll detector
    1
    let lastScrollTop = 0;
    2
    const $html = document.documentElement;
    3
    $html.classList.add('near-top');
    4
    window.addEventListener('scroll', () => {
    5
        const currentScrollTop = window.scrollY || document.documentElement.scrollTop;
  3. JS Scroll Progress Bar Vanilla js JS Scroll Progress Bar Vanilla js
    1
    <div id="_progress"></div>
    2
    
                  
    3
    <style>
    4
    #_progress {
    5
        --scroll: 0%;
  4. JS Get position element/mouse JS Get position element/mouse
    1
    // Determinar las coordenadas del cursor personalizado en relación con la página no es tan fácil.
    2
    // Normalmente, distintos navegadores definen los valores de algunas propiedades de forma diferente.
    3
    // Solución genérica:
    4
    
                  
    5
    function getPosition(e) {
  5. JS Is Scrolling or not JS Is Scrolling or not
    1
    let scrolling = false;
    2
    
                  
    3
    window.scroll = () => {
    4
        scrolling = true;
    5
    };
  6. CSS outlined-text CSS outlined-text
    1
    .parent {
    2
    background-color: color: #144e7b;
    3
    }
    4
    
                  
    5
    .outlined {