Jump to content

Recommended Posts

Posted

Nu este foarte greu de realizat o galerie foto in CSS.

In pagina in care doriti sa creati galeria intre tag-urile <head></head> introduceti codul CSS:

<style type="text/css">

.popup{
position: relative;
z-index: 0;
}

.popup:hover{
background-color: transparent;
z-index: 80;
}

.popup span{
position: absolute;
background-color: #CCCCCC;
padding: 5px;
left: -1000px;
border: 1px dotted;
visibility: hidden;
color: black;
text-decoration: none;
}

.popup span img{
border-width: 0;
padding: 5px;
}

.popup:hover span{
visibility: visible;
top: 0;
left: 80px;
}

</style>[/html]

Apoi intre tag-urile [b][color=orange]<body></body>[/color][/b] introduceti:

[html]<a href="#link-ul vostru" target="_blank" class="popup"><img src="poza_voastra1.jpg" width="100" height="100" border="1" /><span><img src="poza_voastra1.jpg" width="170" height="150" /><br />Descriere sau un titlu aici.</span></a>

<a href="#link-ul vostru" target="_blank" class="popup"><img src="poza_voastra2.jpg" width="100" height="100" border="1" /><span><img src="poza_voastra2.jpg" width="170" height="150" /><br />Descrierea voastra sau un titlu aici.</span></a>

Puteti adauga mai multe poze repetand codul(bineinteles inlocuind numele pozei descrierea si link-ul):

<a href="#link-ul vostru" target="_blank" class="popup"><img src="poza_voastra2.jpg" width="100" height="100" border="1" /><span><img src="poza_voastra2.jpg" width="170" height="150" /><br />Descrierea voastra sau un titlu aici.</span></a>

Sper sa va placa, succes :-h

Te-ai inregistrat? Ne-ar placea sa te prezinti.

Cum pot sustine forumul?
Cumpara de la eMag folosind acest link.
--------------------
oG2BN9d.gifse1WdXd.gifQG6MtmI.gifRHYjDzD.gifG5p1wui.gif

  • 7 months later...

Posted

f bun tutorialu,eu nu ma prea am cu prgramarea nu imi dau seama acolo unde scrie <a href="#link-ul vostru" in locul la ,,link-ul vostru" ce link pun? link unde am uploadat imagine ca habar nam :stars: thanks

Posted

nu, acolo pui un link catre o pagina care vrei sa se deschida atunci cand vei da click pe poza.

daca nu vrei sa ai nici un link la poza, ori pui # daca nu vrei sa se deschida nici o pagina, ori inlaturi legatura catre pagina; stergi codul:

<a href="#link-ul vostru" target="_blank" class="popup"></a>

Te-ai inregistrat? Ne-ar placea sa te prezinti.

Cum pot sustine forumul?
Cumpara de la eMag folosind acest link.
--------------------
oG2BN9d.gifse1WdXd.gifQG6MtmI.gifRHYjDzD.gifG5p1wui.gif

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...

Important Information

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.