Jump to content
GONCALOPES

galeria imagens

Recommended Posts

GONCALOPES

estou a fazer uma pagina de internet, em dreamweaver, em html+css

agora queria fazer uma galeria de imagens bonita e moderna.

só que não sei como fazer, e programação percebo pouco, gostava de algum que fosse open source...

se alguem me puder ajudar agradecia.

Share this post


Link to post
Share on other sites
migueldesousa

queres fazer ou queres algo ja feito se quiseres algo ja feito tens varios sites que teem scripts ja feitos é so procuralos no google


áááá caralhassssssss

Share this post


Link to post
Share on other sites
GONCALOPES

pois prefiro ja feito, mas quando vou  a por na minha pagina...

os meus css ficam alterados, era isso que eu nao queria que acontecesse...

Share this post


Link to post
Share on other sites
GONCALOPES

isso sei eu, tou farto de tentar, e isto, estraga-me o layout todo,

não me podes ajudar se faz favor?

tipo ja tenho o source da galeria, mas mesmo assim, quando meto para lá, estraga-me tudo.

Share this post


Link to post
Share on other sites
GONCALOPES

especifico como?

o genero de galeria que quero?

é isso?

faça-me as perguntas para qual eu irei responder e ser mais esclaredor possivel.

Share this post


Link to post
Share on other sites
fnds

faça-me as perguntas para qual eu irei responder e ser mais esclaredor possivel.

Errado, não temos de ser nós a tentar adivinhar o que tu queres.

Share this post


Link to post
Share on other sites
Nazgulled

A não ser que saibas exactamente o que estás a fazer (o que me parece que não sabes) não podes simplesmente chegar ao site, copiar o código, colocar no teu e rezar para que funcione sem qualquer problema...

Share this post


Link to post
Share on other sites
Dumpster

Epah é assim, se tu fizeste um site com css, e olhas para esse "código" e não o consegues aplicar sem estragar o teu, aconselho-te a tirares umas aulinhas de css antes de tentares fazer isso..

Share this post


Link to post
Share on other sites
GONCALOPES

pois começei o estudo de css a pouco tempo, mas esta pagina web, e para entregar dentro de  dias, e queria uma galeria dessas a funcionar, eu nao percebo muito so lhe dou uns toquezinhos...por isso e que pedi  a vossa ajuda...

Share this post


Link to post
Share on other sites
migueldesousa

mas olha la tu queres entrgar isso com cenas que o teu stor nao te ensinou ?


áááá caralhassssssss

Share this post


Link to post
Share on other sites
GONCALOPES

ele ensinou...o problema e que eu ando sempre no mundo da lua...

xD, e agora vejo o erro que fiz...

Share this post


Link to post
Share on other sites
migueldesousa

<style type="text/css">
/* CSS para a galeria */

.photopreview { 
    width: 400px;
    margin: 0 auto;
    position: relative;
}

.photopreview li {
    float: left;
    width: 100px; height: 75px;
    padding: 10px;
}
.photopreview li img {
    position: relative;
    width: 100px; height: 75px;
    border: 1px outset #CCC;
    padding: 5px; background: #FFF;
}
.photopreview li:hover img {
    cursor: default;
    width: 200px; height: 150px;
    top: -37px; left: -50px;
    border: 1px outset #CCC; padding: 5px;
    z-index: 100; background: #EEE;
}
.photopreview li:active img, .photopreview:active li:hover img {
    width: 400px; height: 300px;
    position: absolute;
    left: 0; top: auto;
}
</style>

<!-- Aqui começa o workaround para IE -->

<!--[if lt IE 7]>
<style type="text/css">
    body {
    behavior:url("csshover.htc");
}
.photopreview li:hover img {
    margin-bottom: -75px; margin-right: -100px;
}
.photopreview li:active img {
    margin-bottom: -150px; margin-right: -200px;
}
</style>
<![endif]-->

<!-- Aqui termina o workaround para IE -->

tenta por isto como ta aqui ... se ficar mal ...algo esta mal com o teu css...


áááá caralhassssssss

Share this post


Link to post
Share on other sites
GONCALOPES

Fiz como disseste, e mesmo assim nao resulta :wallbash: quando fui a experimentar as fotos nao amplia, apesar de aparecer la a maozinha, a clicar, e quando se clica nao faz nada....

vou te mostrar o meu código da folha da galeria.

<html>
<head>
<title>ACESA</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="css/site.css">
<style>
<!--
p.MsoNormal
{mso-style-parent:"";
margin-top:0cm;
margin-right:0cm;
margin-bottom:10.0pt;
margin-left:0cm;
line-height:115%;
font-size:11.0pt;
font-family:"Calibri","sans-serif";
}
.style2 {
border-width: 0px;
}
.style3 {
font-size: 14px;
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
text-decoration: underline;
}
-->
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div>
</div>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" style="text-align: justify">
<tr>
<td align="center" valign="top"><table width="800" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td align="center" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td height="10" align="center" valign="top" bgcolor="#44444E"></td>
</tr>
<tr>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="15" bgcolor="#44444E"> </td>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="5"><img src="images/temp_top_left_im.jpg" width="5" height="5" alt=""></td>
<td></td>
<td width="3"><img src="images/temp_top_right_im.jpg" width="5" height="5" alt=""></td>
</tr>
<tr>
<td> </td>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="5"> </td>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="top"><table width="98%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="80"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>     <a href="http://www.itap-net.org"><img src="images/image001.jpg" width="670" height="65" alt="" align="middle" class="style2"></a></td>
</tr>
<tr>
<td><span class="black-slogan-txt"></span></td>
</tr>
</table></td>
<td align="right" valign="top"><table border="0" cellspacing="0" cellpadding="2">
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center"><table width="100%" border="0" cellpadding="0" cellspacing="0" background="images/bg-top-nav.jpg">
<tr>
                                          <td width="4"><img src="images/left-top-nav.jpg" width="4" height="35"></td>
                                          <td align="center" class="style3">
										<strong>Acesa</strong></td>
                                          <td width="10"><img src="images/joint-top-nav.jpg" width="10" height="35"></td>
                                          <td align="center" class="navigation_text">
										<a href="noticias.html">Noticias</a></td>
                                          <td width="10"><img src="images/joint-top-nav.jpg" width="10" height="35"></td>
                                          <td align="center" class="navigation_text">
										<a href="eventos.html">Eventos</a></td>
                                          <td width="10"><img src="images/joint-top-nav.jpg" width="10" height="35"></td>
                                          <td align="center" class="navigation_text">
										<a href="Galeria.html">Galeria</a></td>
                                          <td width="10"><img src="images/joint-top-nav.jpg" width="10" height="35"></td>
                                          <td align="center" class="navigation_text">
										<a href="Contactos.html">Contactos</a></td>
                                          
                                        </tr>
                                      </table></td>
                                    </tr>
                                    <tr>
                                      <td height="2"></td>
                                    </tr>
                                    <tr>
                                      <td height="8" bgcolor="#DB3C02"></td>
                                    </tr>
                                  </table></td>
                                </tr>
                              </table></td>
                            </tr>
                            <tr>
                              <td height="10" align="center" valign="top"></td>
                            </tr>
                            <tr>
                              <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                <tr>
                                  <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                      <td width="250" height="158">
									<img src="images/logo_acesa_imgem.PNG" width="246" height="155" alt="" align="middle"></td>
                                      <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="10">
                                        <tr>
                                          <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                            <tr>
                                              <td height="22" valign="top"><span class="orange_bold_text">História do Projecto </span><span class="gray_bold_text"></span></td>
                                            </tr>
                                            <tr>
                                              <td height="10" align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                  <td height="1" bgcolor="#999999"></td>
                                                </tr>
                                              </table></td>
                                            </tr>
                                            <tr>
                                              <td height="5" valign="top"></td>
                                            </tr>
                                          </table></td>
                                        </tr>
                                      </table></td>
                                    </tr>
                                  </table></td>
                                </tr>
                                <tr>
                                  <td height="5" align="center" valign="top"></td>
                                </tr>
                                <tr>
                                  <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                      <td width="250" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                        <tr>
                                          <td align="center" valign="top"><table width="93%" border="0" cellspacing="3" cellpadding="0">
                                              <tr>
                                                <td height="25" valign="bottom"><div align="center"><span class="orange_bold_text">Links</span></div></td>
                                              </tr>
                                              <tr>
                                                <td height="1" bgcolor="#999999"></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                              <tr>
                                                <td width="15" valign="top"></td>
                                                <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                      <td height="15"><div align="center"><span class="bold_sky_text">Europen</span></div></td>
                                                      <td width="15" rowspan="5"> </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td valign="top" class="light_gray_text">A Europen é uma grande loucura. Trata-se de uma mostra que integra uma 'instalação'   														artística e uma 'performance' com referências ao campo virtual.</td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="right"><table width="100%" border="0" cellpadding="0" cellspacing="0">
                                                          <tr>
                                                            <td align="right"></td>
                                                       
                                                          </tr>
                                                      </table></td>
                                                    </tr>
                                                </table></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td height="25" align="center" valign="middle"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                              <tr>
                                                <td width="15"></td>
                                                <td width="90%" height="1" bgcolor="#999999"></td>
                                                <td width="15"></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                              <tr>
                                                <td width="15" valign="top"> </td>
                                                <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                      <td style="height: 15px">
													<div align="center"><span class="bold_sky_text">Projecto Ergon</span></div></td>
                                                      <td width="15" rowspan="5"> 
													</td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td valign="top" class="light_gray_text">A plataforma Ergon é criada para permitir a professores, curriculum  desenvolvedores e técnicos, que trabalham com a prática ou na empresa  para aprender uns com os outros.</td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="right"><table width="100%" border="0" cellpadding="0" cellspacing="0">
                                                          <tr>
                                                            <td align="right"> </td>
                                                            </tr>
                                                      </table></td>
                                                    </tr>
                                                </table></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td height="25" align="center" valign="middle"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                              <tr>
                                                <td width="15"></td>
                                                <td width="90%" height="1" bgcolor="#999999"></td>
                                                <td width="15"></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                              <tr>
                                                <td width="15" valign="top"> </td>
                                                <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                      <td height="15"><div align="center"><span class="bold_sky_text">Inform</span></div></td>
                                                      <td width="15" rowspan="5"> </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td valign="top" class="light_gray_text" style="height: 28px">Infor empresa espanhola, pretende  continuar com a sua tarefa colectiva, de serviço e de contribuição no  campo da formação profissional em todo o país de Espanha. </td>
                                                    </tr>
                                                    <tr>
                                                      <td height="3"></td>
                                                    </tr>
                                                    <tr>
                                                      <td align="right"><table width="100%" border="0" cellpadding="0" cellspacing="0">
                                                          <tr>
                                                            <td align="right"> </td>
                                                            
                                                          </tr>
                                                      </table></td>
                                                    </tr>
                                                </table></td>
                                              </tr>
                                          </table></td>
                                        </tr>
                                        <tr>
                                          <td align="center" valign="top"> </td>
                                        </tr>
                                      </table></td>
                                      <td align="center" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="10">
                                        <tr>
                                          <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                            <tr>
                                              <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                  <td height="22" valign="top" class="orange_bold_text">Galeria de Imagens </td>
                                                </tr>
                                                <tr>
                                                  <td height="10" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                      <td height="1" bgcolor="#999999"></td>
                                                    </tr>
                                                  </table></td>
                                                </tr>
                                                <tr>
                                                  <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                     
                                                      <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                        <tr>
                                                          <td height="5" valign="top"></td>
                                                        </tr>
                                                        <tr>
                                                          <td valign="top" class="light_gray_text"><p> </p>														  </td>
													   <tr>
                                                          <td valign="top" class="light_gray_text"><p>
                                                            <style type="text/css">
                                                            /* CSS para a galeria */ .photopreview {     width: 400px;    margin: 0 auto;    position: relative;} .photopreview li {    float: left;    width: 100px; height: 75px;    padding: 10px;}.photopreview li img {    position: relative;    width: 100px; height: 75px;    border: 1px outset #CCC;    padding: 5px; background: #FFF;}.photopreview li:hover img {    cursor: default;    width: 200px; height: 150px;    top: -37px; left: -50px;    border: 1px outset #CCC; padding: 5px;    z-index: 100; background: #EEE;}.photopreview li:active img, .photopreview:active li:hover img {    width: 400px; height: 300px;    position: absolute;    left: 0; top: auto;}
                                                            </style>
														<!--[if lt IE 7]><style type="text/css">    body {    behavior:url("csshover.htc");}.photopreview li:hover img {    margin-bottom: -75px; margin-right: -100px;}.photopreview li:active img {    margin-bottom: -150px; margin-right: -200px;}</style><![endif]-->
                                                          </p>														  </td>
                                                        </tr>
													 <tr>
                                                          <td valign="top" class="light_gray_text">													  </td>
													   <tr>
                                                        <tr>
                                                          <td height="5" valign="top"></td>
                                                        </tr>
                                                      </table></td>
                                                    </tr>
                                                  </table></td>
                                                </tr>
                                              </table></td>
                                            </tr>
                                            <tr>
                                              <td height="10" valign="top"><p> </p>
                                                <ul class="photopreview">
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020008.JPG" alt="Acesa1" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020009.JPG" alt="Acesa 2" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020010.JPG" alt="Acesa 3" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020011.JPG" alt="Acesa 4" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020012.JPG" alt="Acesa 5" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020013.JPG" alt="Acesa 6" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020014.JPG" alt="Acesa 7" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020015.JPG" alt="Acesa 8" width="100" height="75"></a></li>
   <li><a href="#"><img src="../../../Os meus documentos/As minhas imagens/Galeria/09020016.JPG" alt="Acesa 9" width="100" height="75"></a></li>
</ul>
                                            </tr>
                                            <tr>
                                              <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                <tr>
                                                  <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                                                    <tr>
                                                      <td height="1" bgcolor="#999999"></td>
                                                    </tr>
                                                  </table></td>
                                                </tr>
                                              </table></td>
                                            </tr>
                                          </table></td>
                                        </tr>
                                      </table></td>
                                    </tr>
                                  </table></td>
                                </tr>
                              </table></td>
                            </tr>
                            <tr>
                              <td height="10" align="center" valign="top"></td>
                            </tr>
                          </table></td>
                          <td width="5"> </td>
                        </tr>
                      </table></td>
                      <td> </td>
                    </tr>
                    <tr>
                      <td><img src="images/temp_foot_left_im.jpg" width="5" height="5" alt=""></td>
                      <td></td>
                      <td width="5"><img src="images/temp_foot_right_im.jpg" width="5" height="5" alt=""></td>
                    </tr>
                  </table></td>
                  <td width="15" bgcolor="#44444E"> </td>
                </tr>
              </table></td>
            </tr>
            <tr>
              <td align="center" valign="top"><table width="100%" border="0" cellpadding="10" cellspacing="0" bgcolor="#44444E">
                <tr>
                  <td align="center">
				<p class="MsoNormal"><font color="#FFFFFF">
				<span style="font-family: Garamond,serif">© Todos direitos 
				reservados ACESA</span></font></p>
 </td>
                </tr>

   

Share this post


Link to post
Share on other sites
djthyrax

GONCALOPES, passa esse código para o paste.

O Paste não serve para isso. O Paste serve para partilhas rápidas de código no IRC p.e., não para este tipo de posts.

Não peças ajuda por PM! A tua dúvida vai ter menos atenção do que se for postada na secção correcta do fórum!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.