Kezdés
Welcome message

Üdvözlök minden kedves erre tévedőt a Glamour Factory nevet viselő webmagazinon! Az oldal grafikákra, kellékekre, photoshop leírásokra és kódolásra specializálódott, melyek hasznosak és ötlet adóak, inspirálóak lehetnek kezdő, haladó és akár profi oldal szerkesztőknek, blogolóknak. A glamour gyár hetente frissülni fog változatos tanácsokkal, érdekességekkel és tippekkel. Érezd jól magad itt, ha tetszik a munkám nézz be máskor is! bcp de bisous, Efruse

Elérhetőségeink:

 
Partnerek
Partners

Képre vár vagy inaktív:

Orchiq ; Berni ; Birds

 
Üzenj
Chat

 
Köszönet
References

Bizony az oldal nem jöhetett volna létre segítség nélkül, és úgy gondolom, hogy a forrásaim, "nevelőim" megérdemlik azt, hogy megemlítsem őket, köszönetet mondjak nekik. Az alapokat Linda leírásai után sikerült elsajátítanom, általa és nővérem által ismerkedtem meg a honlapszerkesztéssel, csöppentem bele a G-Portál világába. Ahogy egyre jobban belejöttem a dolgokba, úgy ismerkedtem meg több grafikákkal, photoshop leírásokkal, illetve kódok ismertetésével foglalkozó weblappal. Ide tartozik nikkii*, Brielle, Adry és Bogee (az egykori Design World szerkesztője). Mellettük sok támogatást és segítséget nyújtott egyaránt Nikrécia, JuciZed és Gergő. Tovább a külföldi forrásokhoz >>

 
Jövőbeli tervek
Plans for the future
kód navigációs menü
kód projektdoboz
leírás ajánlott betűtípusok
leírás sosugary galéria átalakítása
kód cserék szöveggel, képpel
grafika psd színezések
leírás esztétikus kinézet
 
Elit csere 14#

@2017.03.25.

Minta:

CSS kód:

.csere {
margin: 0 auto !important;
text-align: center;
line-height: 13px !important;
}
.csere a img {
z-index: 99;
filter: url(data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter i&#8230;0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale);
filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: gray;
-webkit-filter: grayscale(100%);
border: 0px !important;
box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) !important;
-moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) !important;
-webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2) !important;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
.csere a:hover img {
filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
filter: none;
-webkit-filter: grayscale(0%);
}
a.cserek, a.cserek2 {
position: relative;
display: inline;
z-index: 8;
}
a.cserek span {
bottom: 28px;
margin-left: -40px;
left: 50%;
}
a.cserek2 span {
bottom: 32px;
margin-left: -40px;
left: 50%;
}
a.cserek span, a.cserek2 span { /* a láthatatlan buborék tartalma */
z-index: 8;
position: absolute;
width: 80px;
color: #ffffff;
background: rgba(0,0,0,0);
font-family: Arial, Helvetica, sans-serif;
font-size: 7px !important;
font-weight: 500;
letter-spacing: 1px;
text-transform: uppercase;
border: 0px solid #000000;
height: 30px !important;
line-height: 17px;
text-align: center;
visibility: hidden;
opacity: .1;
filter: alpha(opacity=10);
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;  
a:hover.cserek span {
bottom: 28px;
left: 50%;
margin-left: -61px;
}
a:hover.cserek2 span {
bottom: 32px;
left: 50%;
margin-left: -61px;
}
a:hover.cserek span, a:hover.cserek2 span {
background: rgba(0,0,0,1);
height: 30px !important;
visibility: visible;
opacity: 1;
z-index: 999;
}

HTML kód:

<div class="csere">
<a class="cserek" href="CSERE URL CÍMÉNEK HELYE 1"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin-left: 0px; margin-right: 2px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek" href="CSERE URL CÍMÉNEK HELYE 2"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin-left: 2px; margin-right: 2px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek" href="CSERE URL CÍMÉNEK HELYE 3"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin-right: 2px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek" href="CSERE URL CÍMÉNEK HELYE 4"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin-left: 2px; margin-right: 0px;" /><span>CSERE NEVÉNEK HELYE</span></a>
<br>
<a class="cserek2" href="CSERE URL CÍMÉNEK HELYE 5"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin: 4px 2px 4px 0px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek2" href="CSERE URL CÍMÉNEK HELYE 6"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin: 4px 2px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek2" href="CSERE URL CÍMÉNEK HELYE 7"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin: 4px 2px;" /><span>CSERE NEVÉNEK HELYE</span></a>
 
<a class="cserek2" href="CSERE URL CÍMÉNEK HELYE 8"><img alt="" src="KÉP URL CÍMÉNEK HELYE" style="width: 70px; height: 80px; margin: 4px 0px 4px 2px;" /><span>CSERE NEVÉNEK HELYE</span></a></div>