środa, 20 czerwca 2012

Glitery opublikowane widoczne po najeździe myszki

Zrobiłam to już dawno, jednak nie wstawiałam na bloga za co przepraszam bo pewnie niektórzy chcieli.
Wygląda to mniej więcej tak:
To jest tło 
Gliter jest niewidoczny.
Po najechaniu na tło. Tło znika a pojawia się gliter.

Styl:
-----------------------------------------------------------
.timerCont {background: url(link) no-repeat;
background-position: center;}.timerCont:hover { background: transparent; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s;}

.timerCont img { opacity: 0;-webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s;}.timerCont img:hover { opacity: 1; webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; }
-----------------------------------------------------------
Czas pojawiania i zanikania glitera ustawić możecie sami, tak samo z tłem ;P

Styl dopasowany do zakładki Wygląd


Online - obniżone

Przy zmianie avatara na większy robi się coś takiego:
Online i ilość odwiedzin podsuwa nam się do góry co niekoniecznie estetycznie wygląda.
Dlatego napisałam styl który przesunie do dołu to

Właśnie tak

Styl:
----------------------------------------------------------
.n_onlineBox {position:relative; top:10px;}
----------------------------------------------------------
Odległość od avatara regulujecie sami, choć dałam takie parametry które ustawiają go w takiej samej odległości co średnie.

Styl jest dopasowany do nowej edycji w zakładce wygląd.
Przycisk CSS PRO

czwartek, 14 czerwca 2012

Znajomi - przesunięcie

Nie wiem  czy jeszcze ktoś tu zagląda, dawno nie pisałam.
Jakoś mi się znudziło trochę.
A co do zmian na gliterach są bardzo przydatne.
Adminsitracja dobrze sie spisała pod tym względem.
Jednak miło by było gdyby napisali kilka słów o tym od kogo się zaczęło pisanie tego.

Przed zmianą:

Po zmianie:

.pc_content, .add_content, .til_content, .tir_content {position: relative; left: 5px;}

Bardziej na środku estetyczniej wygląda.

poniedziałek, 11 czerwca 2012

Pasek Kategorie/Top 100/Gry...

(Kliknij, aby powiększyć)


Jest on stały, po najechaniu trochę się obniża.

A więc kodzisko:


<style>.hmCont {width: 1600px !important;position: fixed !important;background: transparent !important;z-index: 8;top: -10px;left:350px !important;}#pToffg a span {border-right: 0px solid #00B6E9 !important;display: inline;float: left;height: 49px !important;margin-top: 1px !important;padding: 10px 9px 0px 9px !important;margin-left: 10px !important;background: url(link) !important;border-radius: 0px !important;border-bottom-left-radius: 30px 100px !important;border-bottom-right-radius: 30px 100px !important;border: 4px double grey;box-shadow: 0 0 10px black;-webkit-transition:all 200ms;-moz-transition:all 200ms;-0-transition:all 200ms;-ms-transition:all 200ms;}#pToffg a span:hover {padding: 20px 9px 0px 9px !important;}.onlineFrList span div {position: fixed !important;}</style>

Sami zmieniace ramkę, tło i zaokrąglenie.


sobota, 9 czerwca 2012

Bloczek profilowy (3 kody)



Są 3 kody pokazane na screenie powyżej.

1) Avek.

Kod:

<style>.pavatar {width: 290px;height: 190px;background: url(link);position: absolute;top: -130px;left: 13px;z-index: 1;background-size:100%;}.pavatar {border-top-left-radius: 290px 30px;border-top-right-radius: 190px 30px;border: 4px double black;box-shadow: 0px 0px 20px black;}.pavatar img {border-top-left-radius: 290px 30px;border-top-right-radius: 190px 30px;height: 190px !important;opacity:0.0;width: 290px !important;}.main {top: 130px !important;}.n_pnick {position: absolute;top: 38px;left: 10px;z-index: 2;}.n_extraScore {position: relative;top: -130px;left: -8px;z-index: 3;transform: scale(0.8);-webkit-transform: scale(0.8);-moz-transform: scale(0.8);-o-transform: scale(0.8);}.n_extraScore i {color: white;}</style>

Kod Bartika122, ale dodałem go, bo musiałem się "zemścić"za Akemi.

2) Wysuwane oceny.

 <style>.gAv1, .pAv1 {background: transparent !important;}.gAv, .pAv {color: transparent !important;width: 10px;text-align: center;-webkit-transition:all 300ms;-moz-transition:all 300ms;-ms-transition:all 300ms;-o-transition:all 300ms;border-radius:5px 0 0px 5px;}.gAv:hover, .pAv:hover  {color:white!important;width:100px !important;}</style>

3) Miano (własne) 
Tutaj kod zrobiony przez Akemi. Nie wiem, czy mogę go dodać, więc gdy mi pozwoli, to go dodam.