{"id":124695,"date":"2019-01-02T17:56:00","date_gmt":"2019-01-02T16:56:00","guid":{"rendered":"https:\/\/www.justinmind.com\/blog\/pinned-elements\/"},"modified":"2025-02-03T16:45:08","modified_gmt":"2025-02-03T15:45:08","slug":"pinned-elements","status":"publish","type":"post","link":"https:\/\/www.justinmind.com\/es\/soporte\/elementos-fijados","title":{"rendered":"Elementos fijados"},"content":{"rendered":"

Los elementos pueden permanecer en la misma posici\u00f3n en la pantalla cuando el usuario se desplaza hacia arriba o hacia abajo. Esto se llama anclar y puedes utilizarlo para crear efectos Parallax con etiquetas flotantes, contenido centrado, cabeceras pegajosas y mucho m\u00e1s.

Para fijar un elemento:<\/h3>\n
    \n
  1. Selecciona el elemento que desees, ve a la paleta Propiedades y haz clic en la aguja de alfiler de la parte superior derecha de la paleta. Esto har\u00e1 que los par\u00e1metros \u00abX\u00bb e \u00abY\u00bb sean editables. <\/li>\n
  2. Utilizando el desplegable, selecciona el tipo de posici\u00f3n anclada que deseas para el elemento. Puedes a\u00f1adir un margen en px a partir de la posici\u00f3n anclada si deseas un cierto espaciado desde la posici\u00f3n anclada. <\/li>\n<\/ol>\n

    Opciones de posici\u00f3n de las clavijas<\/h3>\n

    Estas son las opciones para fijar un elemento. Las opciones X e Y pueden combinarse para que puedas fijar un elemento arriba y a la izquierda. <\/p>\n

    Eje X<\/h4>\n
      \n
    1. No anclado (por defecto):<\/strong> el elemento no se anclar\u00e1; no se mover\u00e1 con la pantalla<\/li>\n
    2. Fijar a la izquierda:<\/strong> el elemento se fijar\u00e1 a la izquierda de la pantalla.<\/li>\n
    3. Fijar en el centro:<\/strong> el elemento se fijar\u00e1 en el centro de la pantalla.<\/li>\n
    4. Fijar a la derecha:<\/strong> el elemento se fijar\u00e1 a la derecha de la pantalla<\/li>\n<\/ol>\n

      Eje Y<\/h4>\n
        \n
      1. No anclado (por defecto):<\/strong> el elemento no se anclar\u00e1; no se mover\u00e1 con la pantalla<\/li>\n
      2. Fijar arriba:<\/strong> el elemento se fijar\u00e1 en la parte superior de la pantalla.<\/li>\n
      3. Fijar en el centro:<\/strong> el elemento se fijar\u00e1 en el centro de la pantalla.<\/li>\n
      4. Fijar abajo:<\/strong> el elemento se fijar\u00e1 en la parte inferior de la pantalla.<\/li>\n<\/ol>\n

        C\u00f3mo fijar varios elementos<\/h3>\n

        Los grupos no se pueden fijar, s\u00f3lo los elementos individuales. Como alternativa a fijar grupos, puedes agrupar elementos en un Panel Din\u00e1mico y fijar el panel. Por ejemplo, puedes crear un men\u00fa de navegaci\u00f3n que se pegue a la parte superior de la p\u00e1gina cuando te desplaces siguiendo estos pasos: <\/p>\n

          \n
        1. Arrastra cuatro Elementos de Texto al lienzo y ponles t\u00edtulos como si fueran diferentes secciones de tu sitio web.<\/li>\n
        2. Selecci\u00f3nalos todos y luego haz clic con el bot\u00f3n derecho del rat\u00f3n cuando est\u00e9s encima de uno y ve a Agrupar – Agrupar en el Panel Din\u00e1mico.<\/li>\n
        3. Organ\u00edzalas en el orden que quieras y luego ve a la paleta Propiedades y haz clic en la aguja del alfiler. A continuaci\u00f3n, establece el desplegable Y en \u00abPin superior\u00bb. <\/li>\n
        4. A continuaci\u00f3n, a\u00f1ade contenido a la pantalla de modo que crees una p\u00e1gina larga. Simula y el resultado debe ser similar a la imagen siguiente <\/li>\n<\/ol>\n

          \"Elemento<\/p>\n","protected":false},"excerpt":{"rendered":"

          Los elementos pueden permanecer en la misma posici\u00f3n en la pantalla cuando el usuario se desplaza hacia arriba o hacia abajo. Esto se llama anclar y…<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8418,8440],"tags":[],"class_list":["post-124695","post","type-post","status-publish","format-standard","hentry","category-formacion","category-prototipado-responsivo"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/posts\/124695"}],"collection":[{"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/comments?post=124695"}],"version-history":[{"count":1,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/posts\/124695\/revisions"}],"predecessor-version":[{"id":126226,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/posts\/124695\/revisions\/126226"}],"wp:attachment":[{"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/media?parent=124695"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/categories?post=124695"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.justinmind.com\/es\/wp-json\/wp\/v2\/tags?post=124695"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}