T&R splet blog o spletnih storitvah. Razgaljamo tehnologijo!

reference spletnih strani
18th April

Barvni prehodi s CSS

Webkit razvija CSS komponente s svetlobno hitrostjo! Objavili so predlog novega ukaza za CSS 3 in sicer izdelava barvnih prehodov (gradients). Ideja je seveda fantastična, ker se lahko “prehod” prilagaja velikosti okna (DIV). To pomeni, da ne bo potrebno več za ozadje izdelovati grafike, temveč bomo lahko preliv dosegli z enostavnim ukazom v CSS dokumentu. Trenutno predvidevajo dve vrsti: linearnega in radialnega.

Sintaksa:
-webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]? [, <stop>]*)

Primer (samo če ste “lastnik” beta Safarija):
http://xhva.net/webkit_r31878_gradient_radial.html

Preberite si celotno novico.

Deli s skupnostjo:

  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks

Podobni članki:

  1. Zaokroževanje robov s CSS ukazov
  2. Napredno programiranje v CSS s pomočjo LESS
  3. CSS 3 oblikovanje – ideje WebKita
  4. CSS 3 delovne skupine – zadnji sklepi
  5. Več nivojski CSS selektorji
  6. CSS triki – selektorji za Internet Explorer
  7. Kako ohraniti pregledno strukturo CSS dokumenta
  8. Javascript predogled slike – CSS opacity – picture preview – picture fade
  9. CSS triki za Google CHROME brskalnik
  10. Kdaj uporabiti class in kdaj id oznako za CSS selektorje

6x komentirano na “Barvni prehodi s CSS”

  1. Carli je napisal:

    Za to obstaja ena fajn javascript, ki celo deluje.

    http://slayeroffice.com/code/gradient/

    Gre za to, da lahko narediš gradient background brez imiga. In preverjeno deluje. Enostavno postaviš div, kot class nastaviš (class začetnabarva končnabarva smer).

    Primer:

    .naslov {
    height: 20px;
    color: #FFFFFF;
    }

    Menu

    Tadam…

  2. Carli je napisal:

    Eh Menu Tak nekak ….

  3. Roky je napisal:

    @Carli, fajn zadeva. Vseeno pa bi blo lažje, da bi obstajal hiter & učinkovit ukaz, kot Javascript.

  4. Antony je napisal:

    Ravno v tem je poanta, da se dizajnarjem ne bo potrebno zatekati k grafiki ali uporabi javascriota.
    Hvala za link.

  5. Boštjan je napisal:

    Z javascript je tud bolj tko-tko pa radial gradient je tud uprašljivo kako bi delu…

  6. Carli je napisal:

    Ja vsekakor bolje, če je lahko samo ukaz, taki gradienti v IEju delujejo, že kar nekaj časa, nekaj več info http://msdn2.microsoft.com/en-us/library/ms673539%28VS.85%29.aspx, vendar je zopet omejitev pri brskalnikih.

    Alternativa torej JS.

Dodaj komentar