Allegro.pl

Powiązane (2)

  pokaż (2) 
Pokaż: ustaw jako domyślne
pokaż obrazki

Komentarze (26)

  • Reklamy Google

  • Lic3ns3D +3  

    Należy Ci sie za to Ciężarówka piw! Trochę z tych rzeczy już widziałem ale dużo mnie rozwaliło! ;]

    pokaż komentarz
    Lic3ns3D
  • Sh1eldeR +2  

    Fajne! Trzeba tylko pamietac, zeby sie za bardzo z tym nie rozhulac -- wiekszosc z tych technik jest efektowna, ale wiele z nich wymaga uzycia dodatkowego kodu HTML (dodatkowe , etc.). Jeden taki tu i owdzie nie zaszkodzi, ale jesli za bardzo bedziemy uzalezniac HTML od prezentacji, to uzycie standardow straci sporo sensu -- w koncu to rozdzielenia struktury od prezentacji chcielismy w pierwszej kolejnosci!

    @altruista:
    Jesli tego cie uczyli to i tak duzo, ale zauwaz, ze:
    1. Z pewnoscia nie byl to unobtrusive JavaScript (zewnetrzny skrypt wpinajacy sie przez DOM), tylko mieszaliscie wywolania funkcji javascript z HTML-em. To nie jest piekne, ani fajne.
    2. Uzycie JS do tego w ogole nie jest piekne ani fajne: czesto da sie zrobic to samo przy pomocy CSS.

    Myslisz, ze te 2 punkty nie maja zadnego znaczenia? Tacy koderzy onet.pl tez tak zapewne mysleli i stad maja w HTML-u taki bajzel ;). Moim skromnym zdaniem, powszechna akceptacja (?) kodu takiej jakosci jest problemem -- nikt by nie chcial mieszkac w domu, ktorego architekt nie trzymal sie specyfikacji i zalecen. A "stronke to se moze zrobic kazdy licealista". Hm.

    Wracajac do tych 50 technik to polecam je sobie chociaz przejrzec; jest kilka ciekawych rozwiazan zarowno jesli chodzi o CSS, jak i design. A nawet pare linkow do dobrych, darmowych zasobow (ikony!).

    pokaż komentarz
    Sh1eldeR
  • giker 0  

    Dokładnie - JS ma być tylko uzupełnieniem kodu którego nie da się uzyskać HTMLem i CSSem. Dotego JS ma być lekki i nie inwazyjny - czyli nie wpleciony w kod tylko używany razem z DOMem.
    A Hover Efect z użyciem JS to już wogóle jakaś parodia.
    Dotego trzeba pamiętać, że nie wszyscy mają włączony JS w swojej przeglądarce.

    pokaż komentarz
    giker
  • M4ks +1  

    to jest tak samo jak z walidacja - niby sie musi walidowac, a ani google.com sie nie waliduje ani inne wielkie strony a wygladaja dobrze wszedzie i korzysta z nich miliony osob dziennie.
    To samo JS, userzy z wylaczonymi skryptami to 1-2%, nikt sie nimi tez specjalnie nie przejmuje (wylacz JS i wejdz na najwieksze strony, na google, na last.fm etc)

    pokaż komentarz
    M4ks
  • Pixo 0  

    Giker: Co polecisz do stosowania rollovera np. w przypadku menu, gdzie klient koniecznie chce obrazki, a nie tekst? Nie chcę stosować background:url(blabla) tylko poprzez img co by łatwo wstawić tekst alternatywny.

    pokaż komentarz
    Pixo
  • Sh1eldeR +3  

    @M4ks:

    Google ma akurat totalnie do bani kod po stronie klienta. W porownaniu z tym, co potrafia wyczyniac po stronie serwera, zreszta -- cholera -- rowniez w aplikacjach po stronie klienta, maja bardzo slaby kod po stronie klienta. Jest to dla mnie niepojeta zagadka zwazywszy na to, jakich (i ilu!) Google zatrudnia geniuszy.

    Tu chodzi nie tyle o zgodnosc, ile o jakosc. Nic nie usprawiedliwia niedomknietych, czy zle zagniezdzonych tagow w kodzie Google. Trudno mi uwierzyc, zeby nie stac ich bylo na zatrudnienie ludzi, ktorzy potrafia zamknac . Bodajze wlasnie taki blad powodowal, ze jedna z ich stron (nie pamietam jaka... Gmail?) zle sie wyswietlala w ktorejs z czolowych przegladarek (Opera? Safari?). Ewidentnie nie domkneli taga, a jak ktos im zwrocil na to uwage i podal rozwiazanie, odpisali, ze "dziekuja i zostalo to przekazane odpowiedniemu zespolowi". Chodzilo o glupie domkniecie taga! To byle jaki zespol moglby zrobic w minute!

    Ale jesli sie ma taki bajzel w kodzie, ze jest w nim np. 100, czy 1000 bledow, to nie dziwota ze az strach czegos ruszac.

    Cale szczescie, ze kompilator C++ nie pozwoli Google (i innym firmom) na byki w co drugiej linii kodu -- to by dopiero bylo!

    Osobiscie jestem fanem aplikacji Google, korzystam z nich na co dzien i jestem pod wrazeniem Gmaila, czy Spreadsheetow, ale nie mam usprawiedliwienia dla ich niskiej jakosci kodu po stronie klienta (podczas gdy czasami, choc tez nie zawsze, sama funkcjonalnosc maja zrobiona naprawde bardzo fajnie i z dbalnoscia o szczegoly).

    Jesli chodzi o nieprzejmowanie sie uzytkownikami, to to, ze wielu webdeveloperow to olewa, nie jest dla mnie usprawiedliwieniem. Jesli czas/budzet pozwalaja, trzeba IMO o to dbac. Czasami to sie naprawde przydaje i odplaca -- przeciez coraz wiecej ludzi korzysta z przegladarek w telefonach komorkowych (wiele z nich nie radzi sobie z JS -- nie kazdy ma iPhone'a :-) ).

    Google tez to widzi. Wejdz sobie na GMail bez JS-u i przekonaj sie sam. Z last.fm sprawa jest nieco inna: nie wiem, czy daloby sie napisac strone o tym charakterze tak, by mogla sie obejsc bez JS-u. Nie sadze ;). Tak samo Google Docs -- bez skryptow po stronie klienta ta strona nie ma sensu.

    Jednak jest mnostwo stron, ktore wymuszaja posiadanie wlaczonego JS, podczas gdy spokojnie moglyby sie obejsc bez nich. Co by nie mowic, to nie jest fajne.

    [Inna sprawa, ze nie zawsze czas i budzet pozwalaja na stworzenie doskonalego projektu -- to zrozumiale; problem pozostaje jednak problemem]

    pokaż komentarz
    Sh1eldeR
  • Sh1eldeR -2  

    EDIT: 2x dodalo mi ten sam komentarz... (?!)

    pokaż komentarz
    Sh1eldeR
  • giker +2  

    @Pixo

    Robisz background dwa razy wiekszy od obiektu np na wysokość - górna część odpowiada normalnemu stanowi, dolna stanowi:hover. Ustalasz jako background: url() top right, a przy:hover bottom right. I to tyle - piękny rollover zaczytany odrazu przy wczytywaniu strony, bez zacięć i niespodzianek i dotego bardzo elastyczny ;)

    pokaż komentarz
    giker
  • Pixo -1  

    Tak, kojarzę metodę, ale właśnie chodzi mi o to by nie używać background: url() tylko zostać na znaczniku img, chyba, że jest jakaś metoda by dla przeglądarek niegraficznych zostawiać tekst w miejsce tego tła.

    pokaż komentarz
    Pixo
  • Sh1eldeR +1  

    @Pixo:
    Mowisz o przegladarkach np. tekstowych lub innych agentach uzytkownika (np. syntezatory mowy), nie wspierajacych CSS? Oczywiscie, jest mnostwo takich metod!

    Poszukaj "css image replacement techniques".

    Generalnie wyglada to tak:
    1. W kodzie HTML masz normalny tekst, np. jako zawartosc elementu (ten tekst odpowiada atrybutowi alt).
    2. W CSS sprawiasz, ze ten tekst jest niewidoczny, a jako tlo tego elementu ustawiasz obrazek (zwykle z narysowanym tekstem).

    Prosta metoda, by pozbyc sie tekstu z tagu , to deklaracja: text-indent: -9999px; (nie musi byc -9999, moze byc inna duza wartosc) i ew. overflow: hidden. Potem w tle ustawiasz obrazek, i korzystajac z selektora :hover zmieniasz ten obrazek. Voilla!

    Jesli zas masz na mysli przegladarke, ktora jest wizualna i obsluguje CSS, ale nie obsluguje obrazkow, to to juz tak dobrze nie zadziala ;). Ale i na to jest sposob: metoda z dodatkowym elementem span. Niezbyt ladna, ale dziala i nie wymaga JS. HTML wyglada mniej wiecej tak:

    Tekst linku

    W CSS musisz wypozycjonowac (bezwzglednie) tak, by zakryl tresc linka. I dac spanowi obrazek tla. Potem korzystasz z selektora "a:hover span", by zmienic obrazek. Zadziala nawet z wlaczonym CSS i wylaczonymi obrazkami.

    Polecam poszukac na necie, nie moge tego opisac tu bardziej szczegolowo, bo i tak moje komentarze zzeraja za duzy fragment HDD-kow serwera wykopu :D

    pokaż komentarz
    Sh1eldeR
  • bodo +1  

    @Pixo:

    Co polecisz do stosowania rollovera np. w przypadku menu, gdzie klient koniecznie chce obrazki, a nie tekst?

    (li)(a href="adres")tekst alternatywny(/a)(/li)
    wystarczy to ostylowac...

    pokaż komentarz
    bodo
  • Sh1eldeR +1  

    Wlasnie widze, ze wykop wycial mi poczatki i konce tagow i nic nie widac w tych moich przykladach kodu.

    Ten z dodatkowym spanem wygladalby tak:

    (a ...)tekst linku (span)(/span)(/a)

    W przykladzie podanym przez bodo wystarczy do taga (a) dodac obrazek z tekstem jako tlo, oraz deklaracje css "text-indent: -9999px;" by ukryc sam tekst linku.

    pokaż komentarz
    Sh1eldeR
  • popydo +2  

    Jednej rzeczy nie kumam. Co drugi wpis ze Smashing Magazine trafia na SG Wykopu, ale jak dodałem cały Smashing, to wykopały go cztery osoby na krzyż :]

    pokaż komentarz
    popydo
  • mayo +1  

    Też się przyda, tym bardziej, że w wielu przypadkach kieruje do innych stron o tej tematyce.

    pokaż komentarz
    mayo
  • lemur_78 -2  

    każdy test ze Smashing Magazine trafia na wykop... nie lepiej dodać rss do czytnika?

    pokaż komentarz
    lemur_78
  • jeremi +9  

    Ostatnio same pierdoły są wykopywane, także nie narzekaj! ;]

    pokaż komentarz
    jeremi
  • tbhthelolmaker -1  

    [komentarz usunięty]

    pokaż komentarz
    tbhthelolmaker
  • Winhelp +2  

    Hau. Hau.

    pokaż komentarz
    Winhelp
  • altruista -5  

    Hover-effect? W sumie bez rewelacji, tego to mnie uczyli jeszcze w liceum (javascript...)

    pokaż komentarz
    altruista
  • giker +4  

    Jak w liceum da się opanować CSS to już wszystko wiem, ale może jestem starej szkoły i mnie w szkole uczyli podstaw (nawet nie wiem czy już wtedy było coś takiego jak CSS) - webmasterka to są lata nauki w praktyce - inaczej nie da się tego opanować, zasady są sztywne, ale podejście do każdego projektu musi i jest zawsze inne. Znam webmasterów dla których do dzisiaj czarną magią jest zrobienie RollOver na CSSie.

    pokaż komentarz
    giker
  • mayo +6  

    Ja nie wiem do jakiego liceum chodziłeś, jeśli miałeś javascript to gratuluję. Ja byłem w klasie mat-fiz-info i na informatyce miałem: Worda, Excela, PowerPointa ;), a z webdesignu to było tylko: HEAD i BODY.

    pokaż komentarz
    mayo
  • altruista 0  

    ZS 25, Liceum Profliowane nr. XVIII Wrocław profil: zarządzanie informacją.

    pokaż komentarz
    altruista
  • giker 0  

    Ale za przeproszeniem co ma javascript do CSS ? to jak porównywanie php do html.
    Przyznaje, słabo znam javascript, bo większość moich projektów opieram na gołym XHTMLu i CSSie i do szczęścia mi oraz moim zleceniodawcą to wystarcza ;) Strana zbiera w całość bardzo dużo technik, które są lub nie są nowe i mogą lub nie się przydać - ot ciekawe ródło inspiracji ;)

    pokaż komentarz
    giker
  • giker +5  

    Na tabelach i Hover efect w javascripcie ? Wybacz jest XXI wiek i takie techniki już umierają ;)
    Hover efect w CSSie to jest dokładnie jedna linijka z odpowiednio spreparowanym backgroundem ;) A co do tabel - to naprawdę nie wiem co powiedzieć - jeśli masz zamiar pracować jako web developer to odrazu zmień nastawienie. Pracowałem już w wielu firmach gdzie poprzedni główni web developerzy używali tylko tabel i zgadnij co - po przejściu na divy świat się zmienił - wszystko łatwo, szybko i przyjemnie - dotego strony lżejsze i bardziej uniwerslane ;) - Pomyśl o tym.

    pokaż komentarz
    giker
pokaż 

Wykopali i zakopali (204 / 0)