Szykowne narożniki, czyli Nifty Corners - Szykowne narożniki - Nifty Corners |
![]() |
![]() |
Strona 3 z 15 Funkcje JavaScriptZobaczmy pierwszy przykład. W omówieniu, dla uproszczenia i jasności, będą pokazane tylko linie odwołujące się wprost do CSS. Tutaj jest cały kod JavaScript: <script type="text/javascript"> window.onload=function(){ if(!NiftyCheck()) return; Rounded("div#nifty","all","#FFF","#D4DDFF","smooth"); } </script> Funkcja NiftyCheck sprawdza wsparcie DOM [Document Object Model]. Jeśli próba przebiegnie pomyślnie, wywoływana jest tylko jedna tworząca zaokrąglony narożnik funkcja
Parametr pierwszy: Selektor CSSSelektor jest parametrem określającym elementy dokumentu, w których zostaną zastosowane zaokrąglone narożniki. Możesz stosować następujące selektory:
Parametr drugi: wskazanie narożnikówSpójrz ponownie do przykładowego kodu JavaScript: Rounded("div#nifty","all","#FFF","#D4DDFF","smooth"); Drugi parametr wskazuje tutaj, że należy zaokrąglić wszystkie narożniki. Wyszczególniając naróżniki, które mają być zaokraglone, możesz zastosować następujące słowa kluczowe, oddzielając je spacją:
Możesz łączyć słowa kluczowe. Na przykład, możesz użyć parametru Parametry trzeci i czwarty: deklaracja kolorówSpójrz znowu do przykładu: Rounded("div#nifty","all","#FFF","#D4DDFF","smooth"); Trzeci i czwarty parametr określają kolejno zewnętrzny i wewnętrzny kolor dopełnienia przestrzeni, jaka powstaje w yniku zaokraglenia. Kolor musi być określony w formacie szesnastkowym z symbolem #, trzema lub sześcioma cyframi. Możesz również skorzystać z wartości Parametr piąty: opcje narożnikówPoniżej jest przykład kodu JavaScript: Rounded("div#nifty","all","#FFF","#D4DDFF","smooth"); Jak widzisz, jest tutaj piąty parametr:
Dopełnienie pionowe Zanim przeanalizujemy przykłady, pozwól mi objaśnić cenną właściwość Nifty Corners, ale ukrytą. Dodałem proste (podstawowe) pionowe dopełnienie (padding) wokół elementów. Skrypt automatycznie usuwa je przed utworzeniem zaokrąglonych narożników. To bardzo użyteczne rozwiązanie z trzech powodów. łatwiej jest zaadaptować zaokrąglone narożniki w istniejących stronach, strony będą wyglądać lepiej w przypadkach, gdy wyłączona jest obsługa JavaScript, a także unika się nagłego przeskoku w wyglądzie, gdy zaokrąglone narożniki zostaną zastosowane na już istniejących stronach. Optymalną wartością jest dopełnienie szerokości 5px, jeśli chcesz stosować "normalne" zaokrąglone narożniki, a 2px, jeśli chcesz uzyskać niewielkie narożniki. Skoro omówiliśmy wszystkie punkty, możemy rozważyć konkretne przykłady. |
|
Zmieniony ( 26.06.2007. ) |
następny artykuł » |
---|