Autor Tema: Javascript-Texto flotante siempre en pantalla aunque el usuario baje con scroll  (Leído 3689 veces)

LoboBlanco

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 25
    • Ver Perfil
Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo

 :)
« Última modificación: 21 de Junio 2017, 18:55 por Alex Rodríguez »

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Javascript-Texto flotante siempre en pantalla
« Respuesta #1 en: 23 de Mayo 2017, 14:12 »
Buenas LoboBlanco.

Como no has dejado el código, he creado algo para que veas...
Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<title>Cursos aprende a programar</title><meta charset="utf-8">
<style>

#elementofijo {
border: solid 3px blue;
background-color: yellow;
display: inline-block;
margin-left: 80%;
position: fixed;
}
</style>
</head>
<body>

<div id="elementofijo">Yo no me muevo</div>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p>Hola  :)

Estoy haciendo en php y html un programa que presenta preguntas para hacerlas online.

Una de las funciones será presentar un formulario de 45 preguntas con un tiempo de 1 hora y media. Con form con input control radio.

Y quiero que el tiempo que queda aparezca en pantalla como texto flotante, que según la persona que está haciendo el examen va bajando para hacer las preguntas, ese reloj digital de cuenta regresiva vaya bajando, que esté siempre en la parte superior derecha de la pantalla.

He encontrado un script que presenta esa cuenta atras pero no sé como hacer que ese texto flote y siempre permanezca arriba a la derecha de la pantalla. Por más que he buscado no encuentro nada semejante.

¿Alguien sería tan amable de ayudarme?

Muchas gracias, un saludo</p>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>

Espero que eso sea lo que esperas que haga.

Saludos. ;D

LoboBlanco

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 25
    • Ver Perfil
Re:Javascript-Texto flotante siempre en pantalla
« Respuesta #2 en: 23 de Mayo 2017, 18:41 »
Genial, justo lo que buscaba.  :)

Que sencillo, lo que hace el saber, jaja.  ;D

Muchas gracias Pedro   :)

*

Una pregunta para completar. Era parte de por qué no lo conseguía.

¿En qué se diferencia en la definición de css el usar # o . ?

Es decir

<style type="text/css">
#tiempo {
o
<style type="text/css">
.tiempo {

(yo tenia está última

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Javascript-Texto flotante siempre en pantalla
« Respuesta #3 en: 25 de Mayo 2017, 09:36 »
El id, que representamos en css con # se usa para identificar un elemento único, es decir, no debe haber en un mismo documento más de un elemento con el mismo id. Y el punto(.) lo usamos para identificar clases, que podrían contenerla tantos elementos como quisiéramos.

Así que en tu código esto dependerá de como tengas identificado el elemento que contiene la fecha. Si lo tienes identificado con un id pues harás referencia a el usando la # y el nombre dado.

Saludos. ;D

LoboBlanco

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 25
    • Ver Perfil
Re:Javascript-Texto flotante siempre en pantalla
« Respuesta #4 en: 26 de Mayo 2017, 10:31 »
Muchas gracias  :)

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".