Film (chyba tło)

Nudziło mi się więc nagrałam taki film:






Zdjęcie:

Zaokrąglony nagłówek na blogu blogspot.com

Styl

<style>.Header #header-inner {border-radius: 55px 55px 55px 55px;}</style>

ustawiacie zaokrąglenie;


No i tyle, może dodam jakieś style jeszcze dla bloga xD
Chodź wole dla poszkola, ale nie mam pomysłów ;)

Pole z avkiem wysuwane z boku

Czyli jak, wiedziesz myszka to się wysunie xD

<div><div id="wysuwane" style="left: -15px; " class=""> <div id="wewnatrz" style="float:left;width:155px; display:block; margin-left:0px;"><img src="LINK" border="0"><br><br>TEKST<br>TEKST<br>  TEKST <br>TEKST <br>TEKST<br>TEKST<br>TEKST<br>TEKST<br>TEKST<br>TEKST<br> TEKST<br></div></div><style>#wysuwane{ background: url("LINK") no-repeat scroll 0 0 transparent; padding: 10px; width: 231px; height:395px; position: fixed; margin-top: -222px; /*połowa wysokości panelu w górę */ left: 0px; top: 50%; color: white; /* Kolor czcionki */ }.zamknij{ background-position: 0px 0px -333px 0px;} </style><script type="text/javascript"> $(function(){ $("#wysuwane").css("left","-211px"); $("#wysuwane").hover( function () { $("#wysuwane").stop().animate({left: "0px"}, 600 ); $(this).addClass("zamknij"); }, function () { $("#wysuwane").stop().animate({left: "-211px"}, 500 ); $(this).removeClass("zamknij"); });}); </script></div>

Link do avatara na wyświetlanym pasku


Tam gdzie pisze TEKST wpisujecie tekst jaki ma się wyświetlać na wysuwanym pasku, odstęp między nimi <br> oznacza, że kolejny tekst będzie na dole. Jeśli chcecie mieć więcej przerw na pisanie tekstu na dole piszecie jeszcze raz <br> i tyle.


Tu dajecie link na tło wysuwanego paska, ale tak żeby miał odpowiedni kształt, przykłady: http://s4.ifotos.pl/img/topng_rphhper.png
http://s3.ifotos.pl/img/to-3png_rphhpwn.png
http://s4.ifotos.pl/img/to-1png_rphhpsh.png
http://s3.ifotos.pl/img/to-2png_rphhpss.png

Bloki - drugie tło

Czyli jak masz półprzezroczyste tło to tym stylem mieć jeszcze drugie tło pod tym tłem co masz xD

Styl:

<style>div.blockItem {background: url(LINK)no-repeat;}</style>

LINK- link to drugiego tła

I.. tyle

A propo nie będzie więcej notek jak nie dacie pomysłów na style.

Bloki - 2 tło po najechaniu

Tzn. gdy wiedziesz na blok myszką to jemu pojawi się drugie przez  ciebie wybrane tło. Ale pamiętajcie tło bloku musi być przezroczyste lub pół przezroczyste, np: takie 

Styl:

<style>div.blockItem:hover {background: url(LINK)no-repeat;}</style>

W pole gdzie jest napisane LINK dajecie link do obrazka drugiego tła

Przed najechaniem

Po najechaniu

Mini Menu wysuwane

<ul id="Petersoni_menu"><li><div><script>$(function() { $("#panel").css("left", "-70px"); $(".slide_button").toggle(function() { $("#panel").animate({ left: "1140px" }, 500); $(this).addClass("zamknij"); return false; }, function() { $("#panel").animate({ left: "-70px" }, 500); $(this).removeClass("zamknij"); return false; });});</script><div id="panel" style="left: 0px; "> <ul id="main_menu"> <li><a href="http://poszkole.pl/strona">Strona</a></li> <li><a href="http://poszkole.pl/strona/komponenty">Komponenty</a></li> <li><a href="http://poszkole.pl/przyjaciele">Przyjaciele</a></li> <li><a href="http://poszkole.pl/klasy">Klasy</a></li> <li><a href="http://poszkole.pl/grupy">Grupy</a></li> <li><a href="http://poszkole.pl/galerie">Galerie</a></li> <li><a href="http://poszkole.pl/wiadomosci">Wiadomości</a></li> <li><a href="http://poszkole.pl/profil">Profil</a></li> </ul> <a href="#" class="slide_button zamknij">Menu</a></div><style>#panel{ background:url(LINK); border: 3px inset #AAAAAA; padding: 8px; width: 70px; position: fixed; margin-top: -200px; left: 0px; top: 50%; }ul#main_menu{ list-style: none; }#main_menu a{ font: bold 13px Arial; color: #ffffff; text-decoration: none;}#main_menu a:hover{ text-decoration: underline;}#panel{box-shadow: 0 0 5px 2px #ffffff;}.slide_button { background: url(LINK); display: block; height: 63px; text-indent: -9999px; width: 15px;  position: absolute; right: -18px; top: 0px;}.zamknij { background-position: -16px 0px; } a:focus { outline:none; } </style></div>

Tekst jaki dajecie, aby podpisać załącznik do m.in. strony, grup itd.

Link zdjecia do przesuwanego paska, np:http://s2.ifotos.pl/img/meni-pasd_hqsasep.png

Link tła do menu

Kolor tekstu

Wielkość podświetlenia

Kolor podświetlenia


Ustawiacie odległość. Czyli ile wysunie się mini menu w prawą strone

Po naciśnięciu na pasek ,,nawigacji''

Przyjaciele - po prawej stronie

Styl:

<style>div.person, div.smallperson {float: right;}</style>

Dajcie pomysły na style =D

Zestaw z Selena ! XD

( Kliknij będzie większe )

Podobają się ? XD

BIERZESZ - PISZESZ ! XD

2 style XD

Siema jestem Weronika i będę współprowadziła tego bloga :) teraz dodam 2 style XD

Pierwszy na obracany avatar w znajomych  a drugi na obracany avatar w info o mnie :

Pierwszy - <style>.boxFriends img {-webkit-transform: rotate(360deg); -webkit-transition-duration: 0,1s; border-radius: 35px;}.boxFriends img:hover { -webkit-transform: rotate(0deg); -webkit-transition-duration: 0,1s; border-radius: 35px;}</style>

Drugi - <style>.boxUserinfo img {-webkit-transform: rotate(360deg); -webkit-transition-duration: 0,1s; border-radius: 35px;}.boxUserinfo img:hover { -webkit-transform: rotate(0deg); -webkit-transition-duration: 0,1s; border-radius: 35px;}</style>

Oczywiście BIERZESZ - PISZESZ ! XD

Dziękuje ;P

Brushe- Kratka

Gdyby ktoś nie umiał zrobić kratki na swojej grafice (np. blendzie), albo by nie posiadał do tego programu. Daje gotowe brushe - kratka, które wystarczy założyć na grafike xD


Czarne brushe

Białe brushe

Tak wygląda blend (nie mój) przed założeniem brushy

A tak po założeniu brushy

Powiększcie sobie ten blend żeby zobaczyć wyraźniej











A co do styli - nie dodam, bo nie mam pomysłu ;/

Zakrzywiona cała strona

Styl
<style>html {-webkit-transform: rotate(4deg);}</style>

liczba zakrzywienia


Biega o to, ze caała strona jest zakrzywiona.. Coś jeszcze tak zakrzywić, czy coś ;D Piszcie

Zakrzywione bloki xD

Ten styl zakrzywia wszystkie bloki na stronie 

<style>div.blockItem {-webkit-transform: rotate(4deg);}</style>

Liczba zakrzywienia

Ściana - pole tekstowe - takie coś

Jak się najedzie myszką zmieni się obrazek w tym polu

<style>.boxWall div.wall-box-a div.secondary-a input.input-a:hover {background: url(LINK) no-repeat;}</style>

Link do obrazka ;D


Jeśli chcecie styl na to, że jak się najedzie myszą na avatar to się on zmieni na inny obrazek wchodźcie tu KLIK

Ściana - pole do tekstu - swój obrazek

Możliwe, ze juz taki styl gdzieś jest

<style>.boxWall div.wall-box-a div.secondary-a input.input-a {background:url("LINK") ;}</style>

Niedługo dodam jakieś nowe menu, ale jeszcze go nawet nie zaczęłam, ale mam na niego pomysł xD

Ściana - dodaj komentarz - brak ikonki

Styl
<style>.boxWall div.wall-box-b div.secondary-a p.add-comment-a a {background: none;}</style>

I tyle, nic dodać nic ująć xD

Ściana - dodaj komentarz - inna ikonka

Styl

<style>.boxWall div.wall-box-b div.secondary-a p.add-comment-a a {background: url("LINK") no-repeat;}</style>

Daje wam na przykład taką ikonkę jak ja mam na stronie

Ściana- Odstęp między avatarami

Styl

<style>.boxWall div.wall-box-b {padding: 7px;}</style>

Odlęgłość między avatarami;




Piszcie jakie chcecie style, nie mam pomysłu xD

Animka na przezroczystym tle

Taką Animke na przezroczystym tle można wstawiać na jakie tylko chce się tło xD Wiesz, że to nazywa się Render, ale ja wole mówić, że to po prostu obrazek na przezroczystym tle ;D

  

Stopka - zaokrąglona

A wiec nikt nie dodaje komentarzy i sądze,z e nikt tu też nie wchodzi. Ale są pewnie ludzie, którzy potrzebują różnych styli, więc mam dla was styl na zaokrągloną stopkę ;D

<style>#footer {border-radius: 55px 55px 55px 55px;}</style>

Wielkość zaokrąglenia

  

Sondy fajne style :]

Tekst po prawej stronie : <style>.mypoll.mypoll .poll_answer label {text-align: right;}</style>

Pole obrysowane [ładnie wygląda] : <style>div.boxPoll .mypoll {border: 1px dotted fuchsia;}</style>

Zamiast białego tła jakieś ładne tło [obrazek] : <style>div.boxPoll .mypoll {background: url(tło O____o) !important}</style>

Style od Mai : ] mój prof : http://poszkole.pl/strona/26928741/

Po 5 komach nowa notka :3

Maja