Autor wpisu: Vokiel, dodany: 24.10.2010 22:15, tagi: jquery, css, javascript
Ten wpis jest dostępny wyłącznie w języku: English.
Related posts
Autor wpisu: batman, dodany: 22.10.2010 14:57, tagi: javascript
Mozilla Labs jest kuźnią pomysłów, w której powstają projekty mające na celu usprawnienie przeglądarki Firefox. Jednym z takich projektów, który opuścił laboratoria Mozilli i zawitał do najnowszej wersji Firefoxa, jest Sync.
Tym razem programiści popuścili wodze fantazji i wpadli na pomysł, by udostępnić programistom API, dzięki któremu będzie można dowolnie modyfikować wygląd okna przeglądarki. Najciekawsze w tym wszystkim jest to, że modyfikacji będzie można dokonywać z poziomu kodu HTML.
Projekt Chromeless, bo o nim mowa, powstał z połączenia Cuddlefish Lab i Jetpack SDK z domieszką XULRunnera. Diagram prezentujący zasadę idealnie oddaje bieżący stan projektu i wygląda następująco:
Chromeless znajduje się w fazie pre-alfa i jedyne co w chwili obecnej jest dostępne, to repozytorium projektu - http://github.com/mozilla/chromeless. Docelowo projekt Chromeless ma zostać przekształcony w SDK, z którego każdy będzie mógł skorzystać i stworzyć własną przeglądarkę.
Autor wpisu: batman, dodany: 16.10.2010 15:30, tagi: jquery, javascript
Kilka godzin temu napisałem o wydaniu pierwszej alfy jQuery Mobile, a tutaj programiści pracujący nad podstawową wersją biblioteki wydali jQuery 1.4.3. Obok usunięcia kilku błędów i wprowadzeniu ogólnych usprawnień, w bibliotece pojawiły się nowe interesujące funkcjonalności. Są to między innymi:
- przepisanie całego modułu odpowiedzialnego za CSS. Od wersji 1.4.3 można tworzyć własne pluginy, które mogą korzystać z funkcji css i/lub animate. Jako przykład można podać plugin jQuery Rotate.
$('#myDiv').css('rotate', 90); $('#myDiv').animate({rotate: 180});
- znaczna poprawa wydajności metod odpowiedzialnych za przeszukiwanie drzewa DOM.
- prosta, aczkolwiek bardzo potrzebna rozbudowa zdarzenia click, którego wynikiem powinno być zablokowanie domyślnej akcji
$("a").bind("click", false)
- jQuery.type – funkcja pozwalająca określić typ (wewnętrzną klasę Javascript) wskazanej wartości
- jQuery.fx.interval – właściwość pozwalająca na określenie ilości klatek na sekundę dla uruchamianej animacji. Dzięki temu przeglądarki, które korzystają z akceleracji sprzętowej, będą w stanie wyświetlać bardziej płynne animacje.
- jQuery.isWindow – prosta metoda pozwalająca na określenie, czy wskazany obiekt jest oknem (window).
- szereg usprawnień w module data, m.in. wsparcie dla atrybutów data- w HTML5.
Autor wpisu: batman, dodany: 16.10.2010 12:57, tagi: jquery, javascript
Nie tak dawno, bo zaledwie dwa miesiące temu, ekipa odpowiedzialna za jQuery ogłosiła rozpoczęcie prac nad mobilną wersją biblioteki. Dzisiaj programiści otrzymali w swoje ręce pierwszą wersję alfa jQuery Mobile.
W wydanej właśnie wersji mamy do dyspozycji takie komponenty jak:
- zarządzanie wyglądem (Theming)
- kontrolki formularza
- okna dialogowe
- widoki list
- zdarzenia
- efekty przejścia
Biblioteka jQuery Mobile została napisana w taki sposób, aby była jak najbardziej przyjazna dla użytkownika. Udało się to uzyskać poprzez zastosowanie szeregu dobrych praktyk. Są to między innymi:
- Progressive Enhancement – progresywne rozszerzanie funkcjonalności. Nowa biblioteka skupia się na dodawaniu funkcjonalności do już istniejącej treści. Dzięki takiemu podejściu, przeglądarki nieobsługujące Javascript będą w stanie poprawnie wyświetlić stronę.
- Graceful Degradation – stopniowe zmniejszanie jakości prezentowanych treści w zależności od funkcjonalności obsługiwanych przez przeglądarkę. Dzięki temu eliminuje się zero jedynkowe podejście do problemu, czyli działa – nie działa. Oznacza to tyle, że w przypadku braku obsługi jakichś właściwości CSS, przeglądarka wyświetli standardowy element, np. przycisk pozbawiony gradientów, cienia, itp.
- konfiguracja oparta o język znaczników – jQuery Mobile nie wymaga do konfiguracji ani jednego wiersza Javascript. Wszystko odbywa się w kodzie HTML poprzez odpowiednie atrybuty.
- niewielki rozmiar – w przypadku urządzeń mobilnych, rozmiar ma znaczenie. Cały kod Javascript “waży” zaledwie 12KB, a CSS 6KB.
Skąd pobrać?
Niestety w chwili powstawania tego wpisu, wszystkie linki prowadzące do dokumentacji oraz do plików źródłowych były niepoprawne. Dlatego też odsyłam was na oficjalną stronę projektu, gdzie w niedługim czasie powinny się pojawić poprawione linki.
Autor wpisu: batman, dodany: 14.10.2010 08:00, tagi: jquery, javascript
Na początku miesiąca napisałem recenzję książki jQuery. Poradnik programisty. Od tego czasu przeczytałem ją jeszcze raz i z czystym sumieniem oddam ją komuś, kto jako pierwszy odpowie na następujące pytanie.
Co to za miejsce i gdzie się ono znajduje?
Jakiś czas temu pisałem o tym miejscu, więc wystarczy poszukać w archiwum. Odpowiedzieć można w komentarzu pod postem lub wysyłając wiadomość przy pomocy formularza kontaktowego. Powodzenia!
Autor wpisu: Blame, dodany: 05.10.2010 15:36, tagi: javascript
Z racji tego, że powstało już baardzo wiele sposobów na zaokrąglone rogi pomyślałem, że nie będę pisał o niczym nowym. Ten wpis będzie zbiorem tych licznych rozwiązań wykorzystujących zarówno HTML, CSS jak i JavaScript. Na końcu każdej metody pozwoliłem sobie pokazać wady i zalety jej stosowania. Zapraszam do lektury
Sposób pierwszy – CSS3
Jak wiadomo, najnowsza wersja arkuszy stylów pozwala na uzyskanie krągłości na naszej stronie. Aby to zrobić wystarczy nadać danemu elementowi odpowiedni selektor, np. klasę a następnie dodać mu poniższe style:
-khtml-border-radius:
10px
/ 10px;
-webkit-border-radius:
10px
/ 10px;
-moz-border-radius:
10px
/ 10px;
border-radius:
10px /
10px;
Dla wyjaśnienia, pierwsza wartość to szerokość zaokrąglenia, z kolei wartość po slash’u „/” definiuje jego wysokość. W tym wypadku godna polecenia jest strona CSS Border Radius Generator dzięki której wpisując odpowiednie wartości w pola przy rogach możemy na bieżąco obserwować kształt boków a następnie skopiować cały kod CSS.
Zalety
- Wymaga niewielkich zmian w kodzie,
- Używa najnowszych rozwiązań.
Wady
- Rozwiązanie obsługiwane tylko przez najnowsze przeglądarki.