Dziś przychodzę do was z zamówieniem i kilkoma wolnymi okładkami na Wattpada. Mam nadzieję, że wam się spodobają moje prace. Od kilku tygodni nie było żadnego posta ze względu na mój niespodziewany wyjazd. Miałam bardzo kiepski dostęp do internetu. Rodzice stwierdzili, iż za często przesiaduję przed komputerem, ale już jestem i jak zawsze przyjmuje zamówienie.
Zamówienie dla: Aoife.
Po najechaniu myszka na grafikę pokazuje się ukryta kolumna. :)
Kilka okładek na Wattpada:
Wszystkie są wolne.
Dla zainteresowanych mam prosty kod CSS na wysuwane ikony społecznościowe:
Najpierw w Układzie bloga dodajemy gadżet HTML/JavaScript w którym wpisujemy poniższy kod:
<div class='widget HTML' id='IKONKI'>
<h2 class='title'></h2>
<div class='widget-content'>
<center><a href="#/"><img alt="TEKST ALTERNATYWNY" class="centered" src="LINK DO PIERWSZEGO OBRAZKA"/></a><br />
<a href="LINK"><img alt="TEKST ALTERNATYWNY" class="centered" src="LINK DO IKONKI" / /></a><br/>
<a href="LINK"><img alt="TEKST ALTERNATYWNY" class="centered" src="LINK DO IKONKI" / /></a><br />
<a href="LINK"><img alt="TEKST ALTERNATYWNY" class="centered" src="LINK DO IKONKI" / /></a><br />
<a href="LINK"><img alt="TEKST ALTERNATYWNY" class="centered" src="LINK DO IKONKI" / /></a><center></center></center>
</div></div>
( Tekst alternatywny - tutaj możemy wpisać nazwę dla danej ikonki, w razie jakby nam obrazek zniknął, pojawi się tekst, który wpisaliśmy.
Link do pierwszego obrazka - to co ma się pojawiać jako pierwsze np. Zaobserwuj mnie, tutaj mnie znajdziesz etc.
Link - link do strony, na którą ma nas odsyłać po kliknięciu.
Link do ikonki - tutaj wklejamy link do naszej ikonki. Żeby uzyskać taki link musimy wrzucić nasz obrazek na serwis hostingujący np. tinypic.)
Teraz w arkuszu CSS wpisujemy poniższy kod:
#IKONKI .widget-content {
height: 35px;
overflow: hidden;
transition: height .8s ease;
-webkit-transition: height .7s ease;
-moz-transition: height .7s ease;
-o-transition: height .7s ease;
-ms-transition: height .7s ease;
}
#IKONKI:hover .widget-content {
height: 180px;
}
#IKONKI { padding: 1px 4px 3px 2px ;}
Mam nadzieje, że się wam spodobał.
Przyjmuje zamówienia.
