Posts tagged ‘jquery’

Dodałem do repozytorium druga wersje skryptu sticky buttons, poprawki zawierają:

  • poprawione zachowanie w przypadku przewijania kontenera
  • dodanie rekurencyjnego wyliczania animacji po zjechaniu z guzika
  • animacja po zjechaniu jest tylko „odtwarzana”, klatka po klatce, co powinno przyspieszyć jej przetwarzanie
  • poprawione zachowanie w przypadku złapania guzika
  • poprawione zachowanie w przypadku przejechania po liście guzików (problem z płynnością animacji)

Do tego cała masa zmian w kodzie – można powiedzieć, że skrypt jest napisany od zera. Zawiera ujednolicony system obsługi układu współrzędnych poprzez klasę Point, która zwiera metody manipulujące współrzędnymi x,y odpowiednio. Ona także unifikuje jquery’owe left/right oraz pageX/pageY z eventa.

Dopisałem także funkcyjkę bind służącą wiązaniu parametrów funkcji do późniejszego wykorzystania. W przypadku zakończenia animacji, wysyłane jest zdarzenie, którego obsługa powoduje wygaszenie wątku animacyjnego jak również wykrycia zmiany położenia elementu w przypadku np. scroll’owania zewnętrznego kontenera i zakutalizowania swojej pozycji.

Jak to zwykle bywa pare zbiegów okoliczności:

  • zaczęło się do tego wpisu
  • później dodatkowe pomysły na animacje pojawiały się w nieregularnych odstępach
  • później powstał ten layout
  • później 3 wieczorki i strona gotowa

Z tych właśnie zbiegów okoliczności powstała mała stronka: slidemenus.bedkowski.pl

Jak widać  to oczywiście wycinek możliwości samej biblioteki, ale jakoś trzeba przyciągnąć uwagę.

Pewnie niektórzy nie znają, ale pare lat temu pojawiło się bardzo miłe dla oka menu na stronie mjau-mjau, nazwane „sticky buttons”, jednak wykonane w technologii Flash. Ja od jakiegoś czasu rozgryzam jQuery i uznałem, że ciekawym sposobem na podciągnięcie swoich umiejętności, będzie przepisanie takowego menu.

Efekty można zobaczyć na stronie Dominiki Osadców, natomiast źródełko tutaj.

Miłej zabawy.

Trochę upłynęło czasu od ostatniego wpisu, ale byłem dość zajęty pracą na dwoma niezmiernie ciekawymi projektami. Oba są związane ze skryptami ECMA, jeden z nich dotyczy języka JavaScript i jest rozszerzeniem projektu Alladyn w wersji 1.6. Pomysł chodził mi po głowie od dawna, ale dopiero do niedawna dojrzał na tyle, iż uznałem, że czas sie za niego zabrać.

Podstawowe założenia:

  • dodawanie klatek kluczowych poprzez metode addFrames
  • dodawanie klatek oznaczonych labelką
  • wywoływanie animacji „ciągiem” korzystając z metody play
  • wywoływanie animacji korzystając z numeru klatki
  • wywoływanie animacji korzystając z labelki
  • możliwość definowania sztucznej własności, która zawiera callback do skryptu, który ma być wykonany w danej ramce
  • integracja z jQuery
  • definiowanie własności clip korzystając z cztero-elementowej tablicy (clip:rect)
  • dodanie obsługi własności dotyczących kolorów (background-color/border-color/color)
  • obsługa kolorów poprzez trój-elementową tablicę kolejnych składowych RGB
  • dodanie obslugi rownan ruchu Robert’a Penner’a

Wszystkie elementy udało się zrealizować, wynik można obejrzeć tutaj.

Dorzuciłem także parę przykładów:

Zapraszam również do mojego nowszego wpisu, slidemenus oraz strony z demo.

Jeżeli podoba Ci się ten projekt to zapraszam również do obejrzenia, projektu obiektowych komententów skyjs.