Todos juegan - Reto 10Kb

[metacortex]

Lista actualizada de trabajos:

MauroC:
http://flexservo.info/reto_10k/

feral:
http://haize.awardspace.com/

alvlin:
http://alvlin.host.sk/

hades87:
http://websdehades.awardspace.com/

pitufoweb:
http://www.pitufo.name/

hey_alan:
http://cybershaman.awardspace.com/webs/ecologia/

metacortex:
http://www.darioferrer.com/varios/fdw-css/10k/

Raulmmmm
http://www.darioferrer.com/varios/fdw-css/raulmmmm/

josdelaranda
http://codigolimpio.com/concurso_foros/

[metacortex]

Iniciado por DragonX

en FF cuando hago un over sobre la palabra "Okologie" se activa el botón de "ramas de la ecologia" eso esta bien?

Daz me había hecho la misma observación. Al parecer Firefox toma la capa entera como un enlace, lo que no sucede con IE y Opera (en esos navegadores sí funciona bien el hover sobre las letras). Al final no supe cómo resolverlo.

Iniciado por hades87

Así que con los span haces que se iluminen las letras no? pero yo no se como hacer para que al pasar por encima de 1 menú se iluminen

Al principio ese asunto se me hizo complicado, pero luego le agarré la "maña": Ahí la palabra Okologie está repetida 5 veces. Cada SPAN está posicionado absoluto. El visibility: hidden oculta lo que no quiero que se muestre y dejo libre el pedazo que me interesa, el cual también cambia con el hover.

[kahlito]

Felicidades a todos, muy buenos trabajos

Por ahora me quedo con ganas de hacerlo por falta de tiempo...

[hades87]

entiendo metacortex :D, la verdad qeu una idea muy ingeniosa la tuya, eso de jugar con los hidden, los span y enlaces que no tiene enlaces :P

La vedad que me doy cuenta que me queda largo camino por recorrer.

Para cuando otra competencia así en plan masivo? xD

[rith]

Bueno solo me queda felicitar a todos los que terminaron sus paginas, yo soy nuevo y no pude terminar a tiempo pero gracias a todos los que me sacaron de dudas (raul, webosiris, etc..) espero poder terminar a la otra y ser mas competitivo ya que si que estan bonitas las paginas...

Gracias y mis mas sinceras disculpas....

[MauroC]

Pude subir de nuevo mi tiro, perdon la tardanza, pero estuve en un viaje:

http://flexservo.info/reto_10k/

Es el mismo que antes en otro host

[JavierB]

Felicidades a todos los participantes

El trabajo de Meta, me ha gustado mucho

Saludos,

[juaniquillo]

Yo tambien los felicito a todos. Muy buenos diseños con tan poquito peso...

[metacortex]

Jajajaj amigos, sólo para que vean el poder de los estándares en el posicionamiento web. Acabo de husmear en las estadísticas de mi sitio y miren cuáles fueron los términos de búsqueda de Google de ayer:

47 ramas de la ecologia
18 disciplinas relacionadas con la ecologia
8 objeto de estudio de la ecologia
7 ciencias derivadas de la ecologia
6 las ramas de la ecologia
5 objeto de la ecologia
4 ramas de ecologia
4 amas de la ecologia
3 ecologia ramas
3 ecologia y ciencias relacionadas
3 desarrollo webs en joomla
3 ramas de la ecologÃ*a
2 linea joomla titulo madeyourweb
2 disenos web venezuela
2 ciencias y ramas de la ecologia
2 convertir utf iso php
2 historia de como surge la ecologia
2 ventajas y desventajas cms plantilla
2 php convertir a utf 8
2 ramas relacionadas con la ecologia

Con la frase ramas de la ecología aparecemos en la primera página kahlito y yo . No miré con los demás términos.

¿Alguien puede revisar sus estadísticas a ver si le pasó algo similar?.

[hades87]

que bueno meta, si es que deslumbras hasta en google :D, como se mrian las estadisticas de tu sitio?

[metacortex]

No hades87, yo no deslumbro ni en mi casa. Sólo era un comentario referente a estadísticas y términos.

[hades87]

jaja, nah tranqui meta solo te lo decía como un cumplido, ya que al verdad eres bastante mañoso en esto :P

PD se podría mirar de hacer algún toro reto no?

[Mikmoro]

Iniciado por metacortex

Daz me había hecho la misma observación. Al parecer Firefox toma la capa entera como un enlace, lo que no sucede con IE y Opera (en esos navegadores sí funciona bien el hover sobre las letras). Al final no supe cómo resolverlo.

Al principio ese asunto se me hizo complicado, pero luego le agarré la "maña": Ahí la palabra Okologie está repetida 5 veces. Cada SPAN está posicionado absoluto. El visibility: hidden oculta lo que no quiero que se muestre y dejo libre el pedazo que me interesa, el cual también cambia con el hover.

Hola, Metacortex.

Probablemente tienes este asunto más que olvidado, pero me acabo de enterar hoy mismo de la existencia de esta competencia (he estado mucho tiempo fuera de juego).

La cosa es que decías que no supiste cómo resolver el asunto del Firefox y que siempre se iluminara el último link con la "e" cuando pasabas el ratón por la letra grande.
Por si tienes algo de curiosidad, te cuento cómo lo he resuelto:

- En el selector "a span.letra,h1 a", he cambiado el left:0; por right: 0;

a span.letra,h1 a{font-size:190px;font-weight:bold;position:absolute;right:0;top:0;color:#122871;background:transparent}

- he aligerado un poco el contenido de los enlaces de esta manera:

<ul id="toc">
<li><a accesskey="i" href="index.php"><span
class="letra">&Ouml;<span class="inv">kologie
</span></span><span class="titulo ecologia">Inicio</span><span
class="guion"> - </span><span class="subtitulo">Definiendo
conceptos</span></a></li>
<li><a href="hist.php"><span class="letra">ko<span
class="inv">logie
</span></span><span class="titulo historia">Historia</span><span
class="guion"> - </span><span class="subtitulo">&iquest;De
d&oacute;nde surgi&oacute; todo?</span></a></li>
<li><a href="obj.php"><span class="letra">lo<span
class="inv">gie
</span></span><span class="titulo objeto">Objeto
de estudio</span><span class="guion"> - </span><span
class="subtitulo">Bajo la lupa cient&iacute;fica</span></a></li>
<li><a href="disc.php"><span class="letra">gi<span
class="inv">e
</span></span><span class="titulo disciplina">Disciplinas
relacionadas</span><span class="guion"> - </span><span
class="subtitulo">Metodolog&iacute;a investigativa</span></a></li>
<li><a href="rama.php"><span class="letra">e
</span><span class="titulo ramas">Ramas de la
Ecolog&iacute;a</span><span class="guion"> - </span><span
class="subtitulo">Ciencias
derivadas</span></a></li>
</ul>

es decir, quitando todo el contenido a la izquierda de cada letra "iluminable".

¿Qué he hecho con esto?
He alineado siempre el span principal ("letra") a la derecha en lugar de a la izquierda. Entonces he eliminado todo el contenido oculto que cada letra que va a ser iluminada tenía a su izquierda.
¿Qué se consigue? que las capas de los span que van a ser iluminadas estén solapadas hacia la derecha, de manera que siempre posicionas el ratón sobre la que quieras, porque hacia su izquierda no hay nada.
¿Por qué? porque el problema que tenías era que cada capa con todo su relleno oculto siempre ocupaba todo el ancho del recuadro de las letras grandes, y conforme aparecían en el flujo del código se iban poniendo sobre las otras. De esta manera, la última era la de la "e", y por eso se iluminaba siempre, porque siempre cubría a las otras.

Ha sido por pura curiosidad y como un ejercicio muy divertido, porque no podía ser que un diseño tan guapo hiciera quedar mal a Firefox .

El diseño me parece muy, pero que muy bueno. Tienes un gusto con los colores y las formas excelente, de verdad. Me quito el sombrero. Espero que esto no te moleste.

Mikel.

[metacortex]

Qué cosas dices man. Para nada molesta eso . Todo lo contrario te lo aseguro. Déjame analizar ese pedazo de código y te doy respuesta ¿seguro que la parte de los estilos sólo lleva esas modificaciones?.


Edito:

La curiosidad mató al gato y no resistí probar de una vez. Excelente solución . Sorprendente que haya intentado una y otra vez y al final la cosa era tan simple jeje. La explicación estuvo bastante buena también.

Probé además en IE6 y Opera. Todo en orden, gracias por ese datazo .

[Mikmoro]

Iniciado por metacortex

¿seguro que la parte de los estilos sólo lleva esas modificaciones?.

Sí, seguro, y si lo piensas es muy lógico: lo que hiciste fue alinear desde la izquierda, y por eso debías completar con el texto oculto desde el borde para que la letra estuviera en su sitio, y por eso mismo ocupaba siempre todo el ancho.

Con ese pequeño cambio, alineando desde la derecha, sobra todo el relleno de la izquierda, y poniendo sólo el relleno de la derecha, las capas se solapan, teniendo todas siempre a la vista del ratón, ya que el flujo del documento hace que las sucesivas capas se vayan colocando sobre las anteriores.

Mikel.

P.D.: una vez más, quien lo hacía bien era FF.

EDITO: siento el choque: este mensaje iba antes de tu última edición.

[Venechat]

Muy bien me gusto mucho la competencia, lo mejor de todo es que no hay perdedores todos ganan ?