Foros del Web » Creando para Internet » CSS »

Boton "ir al cielo" en css? Es posible?

Estas en el tema de Boton "ir al cielo" en css? Es posible? en el foro de CSS en Foros del Web. Si claro, y muy facil, <a href="#top">boton</a>, eso ya lo se, pero no hay nada mas feo.... Estoy haciendo una web con un amigo y ...
  #1 (permalink)  
Antiguo 07/01/2013, 04:24
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 5 meses
Puntos: 16
Busqueda Boton "ir al cielo" en css? Es posible?

Si claro, y muy facil, <a href="#top">boton</a>, eso ya lo se, pero no hay nada mas feo....

Estoy haciendo una web con un amigo y queremos evitar js a toda costa, de momento vamos muy bien, hemos conseguido hacer casi todo lo que queriamos en "pure css".

Ahora queremos este boton magico. La pregunta es si hay algun transition o animation en css3 para que la pagina suba hasta arriba de alguna forma agradable, no de golpe... xDD

Y ya que estamos preguntando, hay algun selector o algo para detectar la posicion de la pantalla? Es para que el boton pase a display:none --> block segun si ya estas arriba o no...

Gracias por su ayuda!!!
  #2 (permalink)  
Antiguo 07/01/2013, 04:28
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.483
Antigüedad: 17 años, 2 meses
Puntos: 2111
Respuesta: Boton "ir al cielo" en css? Es posible?

Para tu segunda pregunta, puedes usar :target.

Para la primera, no es posible. Tienes que usar javascript para hacer el movimiento. Que, de todas formas, no es nada complejo, con dos lineas de javascript se puede hacer y no sería para nada intrusivo.
  #3 (permalink)  
Antiguo 07/01/2013, 05:06
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 5 meses
Puntos: 16
Respuesta: Boton "ir al cielo" en css? Es posible?

Si no me queda otra tendre que usar js, aunque intentare TODO antes que eso, siempre hay un plan B xDDDDD

Muchas gracias por lo de target, ahora mismo miro si lo puedo hacer yo solito! xDDDD
  #4 (permalink)  
Antiguo 07/01/2013, 05:39
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 11 años, 3 meses
Puntos: 1011
Respuesta: Boton "ir al cielo" en css? Es posible?

Cita:
Iniciado por Bonez Ver Mensaje
Que, de todas formas, no es nada complejo, con dos lineas de javascript se puede hacer y no sería para nada intrusivo.
bastantes más de dos líneas
Cita:
Iniciado por moro666 Ver Mensaje
Muchas gracias por lo de target, ahora mismo miro si lo puedo hacer yo solito! xDDDD
el plan a, b o c es javascript
lee este tema hasta el final
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #5 (permalink)  
Antiguo 07/01/2013, 06:28
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 5 meses
Puntos: 16
Respuesta: Boton "ir al cielo" en css? Es posible?

Vale, soy algo lento... xDDD No se como usar :target para mi segunda cuestion, no lo relaciono... xDDD

Vale, no se puede hacer en css.... que le haremos, seguramente mas adelante si se podra, de momento se queda asi!!
  #6 (permalink)  
Antiguo 07/01/2013, 07:09
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.483
Antigüedad: 17 años, 2 meses
Puntos: 2111
Respuesta: Boton "ir al cielo" en css? Es posible?

Cita:
Iniciado por IsaBelM Ver Mensaje
bastantes más de dos líneas
Cierto. Pensé directamente en jQuery y no conté las tropecientas lineas del framework.

:target funciona para enlaces entre las páginas. Es decir, para navegar en la propia página entre ID's —lo que antes se hacía con el atributo name. Funciona igual que :hover, sólo que en vez de activarse al pasar el mouse por encima, se activa cuando el enlace apunta al ID —cuando hace target.
Ta vez no sea lo que busques, porque no detecta la posición de la pantalla, sino sólo si el enlace —interior— está activo.

Y no hay nada de malo en usar JavaScript. De hecho dudo que en un futuro alguna página medianamente grande no lo use.
  #7 (permalink)  
Antiguo 07/01/2013, 07:22
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 5 meses
Puntos: 16
Respuesta: Boton "ir al cielo" en css? Es posible?

Vale.... Asi que la ultima pregunta:
Con un hover, por ejemplo, puedo pasar de un margin-top: 20px a 40px, y con una transition queda muy bonito.
Con eso del target, se puede hacer algo parecido, por rebuscado que sea?
(mira si me complico la vida que he hecho hasta un slider solo en css xD)
  #8 (permalink)  
Antiguo 07/01/2013, 07:32
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.483
Antigüedad: 17 años, 2 meses
Puntos: 2111
Respuesta: Boton "ir al cielo" en css? Es posible?

Se puede, siempre y cuando quieras afectar al elemento del target en sí, elementos que sean hijos o que sean hermanos —con el selector +.

¿Qué problema tienes con JavaScript? ¿Algún trauma?
  #9 (permalink)  
Antiguo 07/01/2013, 08:20
Avatar de fishdesign  
Fecha de Ingreso: abril-2011
Ubicación: Málaga
Mensajes: 389
Antigüedad: 8 años, 6 meses
Puntos: 95
Respuesta: Boton "ir al cielo" en css? Es posible?

Cita:
Iniciado por Bonez Ver Mensaje
Se puede, siempre y cuando quieras afectar al elemento del target en sí, elementos que sean hijos o que sean hermanos —con el selector +.

¿Qué problema tienes con JavaScript? ¿Algún trauma?
Mucha desinformación es lo que hay con Javascript...que seguimos pensando que solo sirve para hacer animaciones horteras xD
__________________
Web Designer.
Themes-Up!, próximamente
  #10 (permalink)  
Antiguo 07/01/2013, 13:17
 
Fecha de Ingreso: mayo-2011
Mensajes: 214
Antigüedad: 8 años, 5 meses
Puntos: 16
Respuesta: Boton "ir al cielo" en css? Es posible?

Cita:
Iniciado por fishdesign Ver Mensaje
Mucha desinformación es lo que hay con Javascript...que seguimos pensando que solo sirve para hacer animaciones horteras xD
LOL, no me pasa nada con JS, solo que no quiero añadir javascript en mi web solo para esta tonteria, si tuviera que hacer mas cosas en js si lo haria, pero si lo puedo evitar mejor, cuantas menos cosas cargue la web supongo que mas rapido ira, no?

Etiquetas: css3, botones
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 22:05.