Obtenga más información sobre cómo añadir efectos de desplazamiento a rellenos de navegador y de fondo de una página web con Adobe Muse.

Nota:

Adobe Muse ya no añadirá nuevas funciones y dejará de ofrecer asistencia técnica el 26 de marzo de 2020. Para obtener información detallada y asistencia, consulte Página de fin de servicio de Adobe Muse.

Aplicación de efectos de desplazamiento a imágenes configuradas como Relleno del navegador

Los efectos de desplazamiento permiten controlar la velocidad de las imágenes de relleno de fondo del navegador, así como de los elementos de la página con y sin mosaico. Los efectos de desplazamiento se pueden aplicar al relleno del navegador, que utiliza imágenes de fondo en mosaico, escaladas hasta rellenar o configuradas al tamaño original. El relleno del navegador se desplaza a medida que lo hace la página, siguiendo la dirección y la velocidad que haya establecido en la sección Desplazamiento del menú Relleno del navegador.

Nota:

las opciones de desplazamiento se ocultan y dejan de estar disponibles hasta que añade una imagen como fondo de relleno del navegador utilizando el menú Relleno del navegador. No es posible aplicar efectos de desplazamiento a un relleno de navegador con un color uniforme o de degradado.

Cómo añadir efectos de desplazamiento a un relleno de navegador

Si desea configurar efectos de desplazamiento para rellenos de navegador, siga estos pasos:

  1. En la vista Diseño, seleccione Página > Propiedades de la página. En la ficha Diseño, defina el campo Altura mínima en 2000 píxeles. Esto garantiza que la página sea lo suficientemente larga como para desplazarse. Haga clic en OK para guardar los cambios y cierre el cuadro de diálogo de Propiedades de la página.
Actualice el campo de altura mínima en la página Propiedades de la página para volverla más larga.
Actualice el campo de altura mínima en la página Propiedades de la página para volverla más larga.

  1. Haga clic en el vínculo Relleno del navegador en el panel Control. En la ficha Relleno, haga clic en el icono de la carpeta situado junto a la sección Imágenes para elegir un archivo de imagen en su escritorio. Seleccione la opción deseada en el menú Encaje y active la opción de desplazamiento.
Añada una imagen de fondo que aparecerá en la ventana del navegador.
Añada una imagen de fondo que aparecerá en la ventana del navegador.

  1. Haga clic en la ficha Desplazar. Active la casilla de verificación Movimiento de desplazamiento.
Seleccione la casilla de verificación de Movimiento para activar los efectos de desplazamiento en el menú Relleno del navegador.
Seleccione la casilla de verificación de Movimiento para activar los efectos de desplazamiento en el menú Relleno del navegador.

Tómese un momento para revisar la sección Desplazamiento en el menú Relleno del navegador. El campo de la sección central (que actualmente muestra 0 píxeles) se corresponde con la posición clave (la ubicación del control con forma de T) que controla el movimiento. El valor predeterminado de 0 píxeles significa que el control con forma de T está configurado en el borde superior de la ventana del navegador.

El número de píxeles especificado en el campo de posición clave indica que los cambios introducidos en la sección Movimiento inicial se desplazarán (en esa dirección y a esa velocidad) mientras lo hace la página. La parte superior de la página comienza en 0 y el número de píxeles va aumentando a medida que se desplaza hacia abajo. (En el panel Control y el panel Transformar, la distancia desde la parte superior de la página se indica mediante el valor Y).

Los valores introducidos en la sección Movimiento final se aplican cuando la página se desplaza más allá de la posición clave (ubicación del control con forma de T).

El elemento con el efecto de desplazamiento de movimiento aplicado (en este caso, la imagen en mosaico configurada como relleno del navegador) se desplaza en las direcciones con un valor de campo superior a 0. Si tanto la dirección horizontal como la vertical tienen un valor 0, el elemento se fija a la página y permanece inmóvil.

En la sección Movimiento inicial, observará que los valores de los campos tienen una “x” minúscula al lado. Representa el número de veces. En la imagen de Relleno de navegador, la sección de movimiento inicial indica que el relleno del navegador se desplazará hacia arriba, a 1 vez (la misma velocidad) la velocidad de desplazamiento. Si el usuario desplaza la página más rápido, el movimiento del efecto de desplazamiento aumenta de velocidad para adaptarse a su ritmo.

En la sección horizontal (izquierda y derecha), el campo muestra “0”, lo que significa que el relleno del navegador no se desplazará horizontalmente hacia la izquierda o la derecha.

La sección Movimiento final contiene una interfaz similar. En la imagen de Relleno de navegador, el relleno del navegador se configura para desplazarse hacia arriba a 1 vez la velocidad de movimiento y no se desplazará horizontalmente.

Nota:

pase el ratón por encima del botón de información (icono de i) situado en la esquina inferior derecha de la ficha Desplazamiento para descubrir cómo se aplican los efectos de desplazamiento a un relleno del navegador.

  1. Haga clic en los botones de flecha de Movimiento inicial para especificar la dirección vertical (hacia arriba o hacia abajo) o la dirección horizontal (hacia la izquierda o hacia la derecha) para controlar la dirección de movimiento de relleno del navegador.
  2. En la sección Movimiento inicial, introduzca valores numéricos o haga clic en los botones de flecha hacia arriba o hacia abajo para establecer las velocidades de desplazamiento horizontal y vertical. Estas configuraciones se describen con más detalle a continuación. Si el campo de velocidad está configurado como 0, indica que el elemento no se moverá en esa dirección durante el desplazamiento (antes de alcanzar la posición clave).
  3. Actualice los valores de la sección Movimiento final para configurar las direcciones que desee e introduzca valores numéricos en los campos correspondientes para establecer la velocidad de los efectos de desplazamiento.
  4. Para cerrar el menú Relleno del navegador, haga clic en cualquier otra parte de la página.
  5. Seleccione Archivo > Vista previa de página en navegador para cargar la página en una nueva ventana del navegador. Desplácese por la página para comprobar que los efectos de movimiento de desplazamiento se desarrollan correctamente.
  6. Cuando termine la prueba, salga del navegador y regrese a Muse.

Aplicación de movimiento de desplazamiento al relleno de fondo del elemento de una página

Cómo añadir efectos de desplazamiento a un relleno de fondo

El movimiento de desplazamiento puede aplicarse a objetos de la página con imágenes de fondo sin mosaico utilizadas como el relleno. Siga estos pasos:

  1. Mientras edita una página en la vista Diseño, seleccione Página > Propiedades de la página. Aumente la configuración de la altura mínima a, por ejemplo, 2000 píxeles, con objeto de garantizar que la página es suficientemente larga para desplazarse. Haga clic en OK para guardar los cambios y cierre el cuadro de diálogo de Propiedades de la página. De forma alternativa, añada suficiente contenido de página para crear una página más larga.
  2. En la vista Diseño, seleccione la herramienta Rectángulo del panel de control.
  3. Dibuje un rectángulo en la página.
  4. En el menú Relleno, configure una imagen de fondo con o sin mosaico para rellenar el rectángulo.
Añada una imagen de fondo para rellenar el rectángulo y configure las opciones de visualización que desee en el menú Relleno.
Añada una imagen de fondo para rellenar el rectángulo y configure las opciones de visualización que desee en el menú Relleno.

  1. Haga clic en la ficha Desplazamiento del menú Relleno y configure las opciones de desplazamiento.
  1. Haga clic en la ficha Desplazamiento del menú Relleno. Active la casilla de verificación de Movimiento y configure las opciones de desplazamiento.
Utilice la ficha Desplazamiento en el menú Relleno para activar el movimiento de los efectos de desplazamiento.
Utilice la ficha Desplazamiento en el menú Relleno para activar el movimiento de los efectos de desplazamiento y especificar la dirección y velocidad de este.

Fíjese en el control con forma de T que aparece sobre el elemento activado para el movimiento de desplazamiento. El control es una representación visual de la posición clave (actualmente configurada a 100 píxeles por encima del elemento). El icono de la sección central en la ficha Desplazamiento corresponde a la ubicación del control con forma de T en la página. Puede restablecer las posiciones clave para determinar cuándo se producirán los efectos de desplazamiento introduciendo un nuevo valor en el campo central o arrastrando el control con forma de T por la página. Al arrastrar el control con forma de T, el área sobre la posición clave se muestra temporalmente atenuada.

Haga clic y arrastre el control con forma de T, que es una representación visual de la posición clave.
Haga clic y arrastre el control con forma de T hasta la ubicación deseada de la página.

Nota:

el control con forma de T no tiene que extenderse hacia arriba en relación con el elemento seleccionado. Puede arrastrar y soltar el control con forma de T de forma que quede alineado con el borde superior de un elemento o soltarlo de forma que se extienda por debajo de un elemento.

Muse ofrece total flexibilidad durante el proceso de diseño, permitiéndole elegir entre arrastrar los controles o introducir los números en el campo de posición clave para controlar con precisión el movimiento que se produce cuando el usuario desplaza la página.

La ficha Desplazamiento del menú Relleno funciona del mismo modo que la ficha Desplazamiento del menú Relleno del navegador:

  1. Mientras mantiene seleccionado un elemento activado para los efectos de desplazamiento de movimiento, utilice la ficha Desplazamiento del menú Relleno para configurar la posición clave numéricamente; o bien arrastre y suelte el control con forma de T sobre la posición clave en la página.
  2. Configure las direcciones vertical y horizontal, y las velocidades correspondientes, en función de la velocidad con que se desplaza la página en la sección Movimiento inicial. Esta opción determina el movimiento que se producirá antes de que la página se desplace hasta la posición clave.
  3. Configure las direcciones vertical y horizontal, y las velocidades correspondientes, en función de la velocidad con que se desplaza la página en la sección Movimiento final. Esta opción determina el movimiento que se producirá cuando la página sobrepase la posición clave.

Nota:

en la imagen con las propiedades de desplazamiento, el rectángulo está configurado para desplazarse hacia la derecha a 3 veces la velocidad de desplazamiento de la página, y llegar a su lugar en el diseño cuando la página del navegador alcanza la posición clave. Cuando el visitante se desplaza más allá de la posición clave (100 píxeles), el rectángulo empieza a desplazarse hacia la izquierda, fuera de su lugar, a 3 veces la velocidad de desplazamiento de la página. En este ejemplo, el rectángulo no se desplaza verticalmente porque ambos campos verticales están configurados como 0.

  1. Para cerrar el menú Relleno, haga clic en cualquier otra parte de la página.
  2. Pulse Vista previa o seleccione Archivo > Vista previa de página en navegador para comprobar los efectos de desplazamiento después de aplicarlos. Desplácese por la página para ver cómo se mueve el elemento.
  3. Regrese a Muse o haga clic en el botón Diseño cuando termine la prueba para continuar editando la página.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea