Foros del Web » Creando para Internet » HTML »

Efecto Máscara / Marquesina

Estas en el tema de Efecto Máscara / Marquesina en el foro de HTML en Foros del Web. Hola: Me interesaría saber si se puede combinar un texto movil ( <MARQUEE > texto1 </MARQUEE> ) con un fondo, usando el texto de máscara ...
  #1 (permalink)  
Antiguo 30/11/2005, 09:03
 
Fecha de Ingreso: junio-2005
Mensajes: 93
Antigüedad: 19 años, 5 meses
Puntos: 0
Efecto Máscara / Marquesina

Hola:
Me interesaría saber si se puede combinar un texto movil
( <MARQUEE > texto1 </MARQUEE> )
con un fondo, usando el texto de máscara
<div style="position: absolute; left: 10; top: 610; filter: mask
(color=#ffffff); width: x; height: y">
<h2> texto1 </h2>
</div>


Muchas Gracias !!!
Cod 96
  #2 (permalink)  
Antiguo 04/12/2005, 17:05
 
Fecha de Ingreso: junio-2005
Mensajes: 93
Antigüedad: 19 años, 5 meses
Puntos: 0
Efecto ...

Hola:
Me interesaría saber si se puede combinar un texto movil TRANSPARENTE
( contenido en una variable ) con un fondo, usando el texto de máscara.


Probé con el tag ( <MARQUEE > texto1 </MARQUEE> )
tratando de combinarlo
<div style="position: absolute; left: 10; top: 610; filter: mask
(color=#ffffff); width: x; height: y">
<h2> texto1 </h2>
</div>

no llego al resultado
Muchas Gracias !!!
Aspirin
  #3 (permalink)  
Antiguo 05/12/2005, 08:55
 
Fecha de Ingreso: diciembre-2005
Mensajes: 4
Antigüedad: 18 años, 11 meses
Puntos: 0
Java

Creo que en CSS no podrás conseguir ese efecto !!!
Java es mucho más potente y versatil.
CSS se está extinguiendo como los dinosaurios...

Salu2
  #4 (permalink)  
Antiguo 05/12/2005, 09:03
 
Fecha de Ingreso: diciembre-2005
Mensajes: 4
Antigüedad: 18 años, 11 meses
Puntos: 0
De acuerdo Java

Creo que en CSS no podrás conseguir ese efecto !!!
Java es mucho más potente y versatil.
CSS se está extinguiendo como los dinosaurios...

Salu2
  #5 (permalink)  
Antiguo 05/12/2005, 09:34
 
Fecha de Ingreso: junio-2005
Mensajes: 93
Antigüedad: 19 años, 5 meses
Puntos: 0
Destalle

Estimado Kopaka:

fijate en este link

http://j.domaindlx.com/miscosas/codes/MarqueTrans.asp

y verás que sólo falta "que las letras sean transparentes"...

- por supuesto, sin desmerecer Java - pero creo que con HTML se puede solucionar "elegantemente" !!!!!
  #6 (permalink)  
Antiguo 05/12/2005, 10:20
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 19 años, 9 meses
Puntos: 0
Cita:
Iniciado por Kopaka
CSS se está extinguiendo como los dinosaurios...
¡JAJAJAJAJAJAJAJAJAJA! ¡Me alegraste el lunes!

JAVA es muy potente, pero no tiene absolutamente nada que ver con CSS. Para lo que busca puede usar JavaScripts, buscá en Google JavaScript Scrollers y seguro encontrás varios (el tag marquee no es estándar y no funciona en todos los navegadores).

El tema de la máscara... ahí ya me mataste. Quizás se pueda hacer con CSS usando filtros, pero tampoco son estándares y tampoco funcionan en todos los navegadores.

Lo podés hacer a mano. En vez de 'scrollear' un texto, hacelo con una imagen del color que quieras con el texto 'calado'. Un gif con transparencias sería suficiente. No sé si me explico :S

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #7 (permalink)  
Antiguo 05/12/2005, 10:47
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 23 años, 2 meses
Puntos: 381
Cita:
Iniciado por Kopaka
Java es mucho más potente y versatil.
CSS se está extinguiendo como los dinosaurios...
Me pregunto qué relación tiene el tocino con la velocidad


...por no mencionar que esa afirmación está bastante lejos de la realidad (lo de la extinción de los css me refiero)
  #8 (permalink)  
Antiguo 05/12/2005, 10:48
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 19 años, 5 meses
Puntos: 17
Cita:
Iniciado por Kopaka
Creo que en CSS no podrás conseguir ese efecto !!!
Java es mucho más potente y versatil.
CSS se está extinguiendo como los dinosaurios...
Perdón? Yo podría decir que los que no usan CSS son los que se están extinguiendo!, sin embargo cada quien usa sus recursos como puede y comentarios como ese no aportan nada.

ASPirin, la etiqueta <marquee> es de propiedad de microsoft, así que no te funcionará en navegadores que no sean IE.

por otra parte:
<div style="position: absolute; left: 10; top: 610; filter: mask(color=#ffffff); width: x; height: y">

left: 10 ??? 10 que? px, em, %?
top: 610 ???? lo mismo que antes
filter: mask(color=#ffffff) ?????
width: x ????? el valor en en px em o %?
height: y ?????

Saludos,
__________________
Al final del día hablar es gratis, codificar no lo es
  #9 (permalink)  
Antiguo 05/12/2005, 10:51
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 23 años, 2 meses
Puntos: 381
...me olvidaba

...coincido en la solución propuesta por thunder.scripts de que el texto esté hecho con gif con áreas transparentes para las letras.

Otra forma sería hacerlo con flash
  #10 (permalink)  
Antiguo 05/12/2005, 11:36
 
Fecha de Ingreso: junio-2005
Mensajes: 93
Antigüedad: 19 años, 5 meses
Puntos: 0
Redondeamos ?

Hola Tunait:
Me interesaría si podudieras orientarme un poco con lo del texto calado, o texto con gif y como "darle" movimiento...

Gracias !!!!
  #11 (permalink)  
Antiguo 05/12/2005, 11:56
Avatar de marioStudios
Colaborador
 
Fecha de Ingreso: octubre-2005
Ubicación: Chiapas; México.
Mensajes: 1.626
Antigüedad: 19 años
Puntos: 212
Aspirin si se puede hacer semitransparente una un texto con su fondo solo coloca este código en la etiqueta de tu texto y listo:

<marquee style="FILTER: Alpha (Opacity=70,
FinishOpacity=70,
Style=1,
StartX=0,
StartY=0,
FinishX=50,
FinishY=10">Texto</marquee>
A mi me funcionó, solo que no lo use con marquee (no lo nesecite):
http://mx.geocities.com/macsy_2000 !!!
Suerte.
__________________
Diseño Gráfico Digital - Fotomontajes - marioStudios
Debes Mat 6:33 con Heb 11:1, DLB. Luc 2:14!!!
  #12 (permalink)  
Antiguo 05/12/2005, 12:01
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 19 años, 9 meses
Puntos: 0


Si te fijas, el texto es transparente. En photoshop eso se puede lograr haciendo click derecho sobre la capa que contiene el texto y seleccionando la opción "Select layer transparency". De esa forma se genera una selección con el contorno del texto que podemos usar para calar la capa de color.

En http://rumkin.com/tools/marquee/ tenés un generador de marquesinas sin necesidad de usar <marquee> ("In-Out" es lo más parecido a marquee).

EDIT: el link de arriba es para otra cosa, me confundí. Si encuentro algo te aviso.

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar

Última edición por thunder.scripts; 05/12/2005 a las 12:07
  #13 (permalink)  
Antiguo 05/12/2005, 12:03
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 19 años, 9 meses
Puntos: 0
Cita:
Iniciado por marioStudios
<marquee style="FILTER: Alpha (Opacity=70,
FinishOpacity=70,
Style=1,
StartX=0,
StartY=0,
FinishX=50,
FinishY=10">Texto</marquee>
A eso me refería con el css propietario de ie que no funciona en ningún otro navegador. Filter malo.

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #14 (permalink)  
Antiguo 05/12/2005, 12:09
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 19 años, 9 meses
Puntos: 0
Probá con este http://www.perlunity.de/javascript/s...403_main.shtml

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #15 (permalink)  
Antiguo 05/12/2005, 12:11
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 19 años, 9 meses
Puntos: 0
Con una vez basta :S
http://forosdelweb.com/showthread.ph...33#post1352333
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #16 (permalink)  
Antiguo 05/12/2005, 13:12
 
Fecha de Ingreso: junio-2005
Mensajes: 93
Antigüedad: 19 años, 5 meses
Puntos: 0
marioStudios :
Que bueno que se pueda hacer...
No te pido el código, pero me interesaría una pista de cómo buscarlo en Google... Evidente que Marque solo funca para IE...


Gracias !!!!
  #17 (permalink)  
Antiguo 08/12/2005, 15:06
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 22 años
Puntos: 317
Hola todos :

No sé que está pasando que las preguntas se repiten. Y tiene que ser problema del foro ¡ porque también se repiten las respuestas !. Con esto de juntar los temas se me había perdido y por eso otra vez llego tarde.

Aunque ya respondieron, igual posteo el mensaje a ver si aporto algo más.

baccxus : me parece que Kopaka quiso decir HTML, que ya no se actualiza; y no CSS.

Con respecto a los errores en el código, bué, si ves la página de ejemplo te vas a dar cuenta de que ASPirin recién empieza; y empieza muy mal.

ASPirin : hace poco recordé que había puesto un ejemplo muy lejano

Todo sobre colores #19

pero te dejo otro aquí

Código:
<div style="background: url('http://www.forosdelweb.com/images/vbulletin3_logo_fdw.gif '); font-size:100%; height:4em; ">
<marquee style="filter:chroma(color='#abcdef'); background-color:blue; ">
<div style="font-size:4em; font-weight:900; color:#abcdef; background: blue; height:1em; " > texto1 </div>
</marquee>
</div>
El filtro no es mask sino chroma, y junto con la marquesina son propietarios de IE. Esta última es soportada de manera muy limitada también por Firefox. Y trata por favor de poner ejemplos con imágenes más livianas.
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




La zona horaria es GMT -6. Ahora son las 17:50.