[Rendimiento]  Se puede conseguir este efecto?
* URL del foro: http://www.unadedd.co.cc/ * Versión del foro: 1.6 * Actualización: a 1.6.1 Hola a todos! Vereis he seguido los pasos para dejar e...


Hola a todos!
Vereis he seguido los pasos para dejar el portal en pestañas y en la pestaña principal me gustaria hacer este efecto como unas mini fichas que lleven al post del foro.
Seria algo asi:
[Imagen: 325menudd.png]
A lo mejor puede hacerse en HTML junto con un css e introducirse en el portal... Aunque creo que a la hora de editar las fichas habría que hacerlo manualmente (añadiendo mas código)

Podría hacerse un plugin, pero yo no tengo ni papa de php.
claro,yo me suponia que se podria hacer en html y css.
Si se hiciera un plugin para cambiar los datos seria la leche aver si ve el tema edson por ejemplo y si se anima....
De todos modos podria sacar alguien el codigo a utilizar,yo lo he intentado pero nose mucho de esto todavia...
Tendrías que crear una tabla en html la cual use el css. Conseguir ese efecto mas que complicado es laborioso.
de echo eso es php.

utiliza por asi decirlo un sistema de imagenes en bd.

y tambien variables que hacen que aparesca, aparte de funciones.
Con CSS se puede ,algo así:
<img src="URL" id="imagen" />
<div class="toltip">
Harry Potter
Categoría: Aventura
</div>
CSS:
img#imagen:hover .toltip
{
background:black;
color:white;
position:absolute;
margin-left:13px;
}
Habría que cambiar más el css ,pero esto sería una idea general de como hacerlo.
Etc..
También se puede con JS ,pero con CSS es más fácil.
Última modificación: 2 Apr, 2011, 1:36 am por juan.
si cada que quieras poner una imagen tendrias que hacer eso.

y digo que es php porque segun lo que vi se actualizan varias veces
Ya sería PHP ,pero naah!
Es así ,cada vez que pones una imagen tendrás que hacer eso.
Y necesariamente no sería PHP ,a lo mejor lo actualizan cada rato xD
PD: ¿Cuál es la web de esa cap?
He conseguido sacar este codigo aunque seguro que no esta bien del todo...aver si alguien que entiende le echa un vistazo aver si se puede conseguir lo mismo en menos codigo.
pueden probar el resultado creando un html.
A mi gusto esta bien asi...pero si se pudiera conseguir sin tanto codigo seria la leche,tambien estaria bien no tener que meter la url del tema entera(que fuera algo como href="{post_id}")para solo meter el id del tema.
Bueno aqui dejo el codigo por si alguien se anima a echarle un vistazo!
Código:
<tr>
        <tr>

          <td width="14">&nbsp;</td>

          <td width="0" align="left">

          

            <table align="center" border="0" cellspacing="0" cellpadding="0">

              <tr>

                    <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                  <tr>                  </tr>

                  </table></td>      <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                  <tr>                  </tr>

                  </table></td>      <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                  <tr>                  </tr>

                  </table></td>      <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                  <tr>                  </tr>

                  </table></td>      <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                  <tr>                  </tr>

                  </table></td>                </tr>    <tr>

                  <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                      <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                        <tr>

                          <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                        </tr>

                      </table></td>
                  </tr>

                    <tr>

                      <td height="37" align="center"  valign="top"><table width="50" border="0" cellpadding="0" cellspacing="0">

                        <tr>

                          <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                            Titulo
                            </span></strong></font></td>
                        </tr>

                      </table><br></td>
                  </tr>

                    </table></td>   <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                      <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                        <tr>

                          <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                        </tr>

                      </table></td>
                  </tr>

                    <tr>

                      <td height="37" align="center"  valign="top"><table width="50" border="0" cellpadding="0" cellspacing="0">

                        <tr>

                          <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                            Titulo
                            </span></strong></font></td>
                        </tr>

                      </table><br></td>
                  </tr>

                    </table></td>   <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                      <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                        <tr>

                          <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                        </tr>

                      </table></td>
                  </tr>

                    <tr>

                      <td height="37" align="center"  valign="top"><table width="100" border="0" cellpadding="0" cellspacing="0">

                        <tr>

                          <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                            Titulo
                            </span></strong></font></td>
                        </tr>

                      </table><br></td>
                  </tr>

                    </table></td>   <td width="20%" align="right"><table width="50%" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                      <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                        <tr>

                          <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                        </tr>

                      </table></td>
                  </tr>

                    <tr>

                      <td height="37" align="center"  valign="top"><table width="100" border="0" cellpadding="0" cellspacing="0">

                        <tr>

                          <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                            Titulo
                            </span></strong></font></td>
                        </tr>

                      </table><br></td>
                  </tr>

                    </table></td>   <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                    <tr>

                      <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                        <tr>

                          <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                        </tr>

                      </table></td>
                  </tr>

                    <tr>

                      <td height="37" align="center"  valign="top"><table width="100" border="0" cellpadding="0" cellspacing="0">

                        <tr>

                          <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                            Titulo
                            </span></strong></font></td>
                        </tr>

                      </table><br></td>
                  </tr>

                    </table></td>
                  

                  </tr>    <tr>

                          <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                          <tr>

                            <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                          </tr>

                        </table></td>
                  </tr>

                      <tr>

                        <td  valign="top" align="center"><table width="100" border="0" cellpadding="0" cellspacing="0">

                          <tr>

                            <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                              Titulo
                              </span></strong></font></td>
                          </tr>

                        </table><br></td>
                  </tr>

                      </table></td>

                          <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                          <tr>

                            <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                          </tr>

                        </table></td>
                  </tr>

                      <tr>

                        <td  valign="top" align="center"><table width="100" border="0" cellpadding="0" cellspacing="0">

                          <tr>

                            <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                              Titulo
                              </span></strong></font></td>
                          </tr>

                        </table><br></td>

                  </tr>

                      </table></td>

                          <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                          <tr>

                            <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                          </tr>

                        </table></td>
                  </tr>

                      <tr>

                        <td  valign="top" align="center"><table width="100" border="0" cellpadding="0" cellspacing="0">

                          <tr>

                            <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                              Titulo
                              </span></strong></font></td>
                          </tr>

                        </table><br></td>
                  </tr>

                      </table></td>

                          <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                          <tr>

                            <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>

                          </tr>

                        </table></td>
                  </tr>

                      <tr>

                        <td  valign="top" align="center"><table width="100" border="0" cellpadding="0" cellspacing="0">

                          <tr>

                            <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                              Titulo
                              </span></strong></font></td>
                          </tr>

                        </table><br></td>
                  </tr>

                      </table></td>

                          <td width="20%" align="right"><table width="99%" border="0" cellspacing="0" cellpadding="0">

                      <tr>

                        <td  valign="top" align="center"><table border="0" cellpadding="1" cellspacing="0">

                          <tr>

                            <td bgcolor="#4269D7"><a  href="" ><img src="" alt="" width="110" height="140" border="0"></a></td>
                          </tr>

                        </table></td>
                  </tr>

                      <tr>

                        <td  valign="top" align="center"><table width="100" border="0" cellpadding="0" cellspacing="0">

                          <tr>

                            <td align="center" bgcolor="#4269D7"><font color="#FFFFFF" size="1" face="Verdana, Arial, Helvetica, sans-serif"><strong>

                              Titulo
                              </span></strong></font></td>
                          </tr>

                        </table><br></td>
                  </tr>

                      </table></td>
</table>
<tr>
                        <td class="tcat smalltext" align="center" colspan="3">
                            <strong>juegos</strong>
                        </td>
                    </tr>
Última modificación: 2 Apr, 2011, 4:42 am por Tricfire.