lsaquolsaquo home jQuery Cycle Plugin Sprawdź Cycle2. najnowsze cykle pokazów slajdów. Plugin jQuery Cycle to wtyczka do pokazu slajdów, która obsługuje wiele różnych typów efektów przejścia. Obsługuje pauzę po najechaniu kursorem, automatyczne zatrzymywanie, automatyczne dopasowywanie, wcześniejsze wywołania zwrotne, wyzwalacze kliknięć i wiele więcej. Obsługuje także, ale nie wymaga, wtyczkę Easing. Jak to działa Wtyczka udostępnia metodę zwaną cyklem, która jest wywoływana na elemencie kontenera. Każdy element podrzędny kontenera staje się przesuwem. Opcje kontrolują, jak i kiedy slajdy są przenoszone. scrollRight (kliknij) Obrazy są używane w tych prezentacjach, ponieważ wyglądają fajnie, ale pokazy slajdów nie są ograniczone do obrazów. Możesz użyć dowolnego elementu, który chcesz. Przeglądaj efekty Użyj strony Przegląd efektów, aby wyświetlić podgląd dostępnych efektów. Zobacz więcej przykładów i przykładów Plugin Cycle oferuje wiele opcji dostosowywania pokazu slajdów. Domyślne wartości opcji można przesłonić, przekazując obiekt opcji do metody cyklu, używając metadanych w elemencie kontenera lub zmieniając wartości we własnym kodzie. Więcej informacji o opcjach można znaleźć na stronie Informacje o opcjach. Podziękowania Specjalne podziękowania dla Torsten Baldes. Matt Oakes i Ben Sterling za wiele pomysłów, które pomogły mi napisać Cycle w 2007.lsaquolsaquo home jQuery Cycle Plugin Plugin jQuery Cycle to lekka wtyczka do pokazu slajdów. Jego implementacja opiera się na wtyczce InnerFade autorstwa Torsten Baldes, wtyczce Slideshow autorstwa Matta Oakesa oraz wtyczce jqShuffle autorstwa Benjamina Sterlinga. Obsługuje zatrzymanie po zatrzymaniu, automatyczne zatrzymanie, automatyczne dopasowanie, wcześniejsze wywołania zwrotne, wyzwalacze kliknięć i wiele efektów przejścia. Obsługuje także, ale nie wymaga, wtyczkę Metadata i wtyczkę Easing. Jak to działa Wtyczka udostępnia metodę zwaną cyklem, która jest wywoływana na elemencie kontenera. Każdy element podrzędny kontenera staje się przesuwem. Opcje kontrolują, jak i kiedy slajdy są przenoszone. scrollRight (kliknij) Obrazy są używane w tych prezentacjach, ponieważ wyglądają fajnie, ale pokazy slajdów nie są ograniczone do obrazów. Możesz użyć dowolnego elementu, który chcesz. Przeglądaj efekty Użyj strony Przegląd efektów, aby wyświetlić podgląd dostępnych efektów. Zobacz więcej przykładów i przykładów Plugin Cycle oferuje wiele opcji dostosowywania pokazu slajdów. Domyślne wartości opcji można przesłonić, przekazując obiekt opcji do metody cyklu, używając metadanych w elemencie kontenera lub zmieniając wartości we własnym kodzie. Więcej informacji o opcjach można znaleźć na stronie Informacje o opcjach. Po co kolejna implementacja pokazu slajdów chciałem uzyskać wsparcie dla kilku dodatkowych funkcji, takich jak pauza-na-hover, automatyczne dopasowywanie, zatrzymywanie pokazu slajdów i używanie wtyczki metadanych. I kiedy zobaczyłem wtyczkę jqShuffle Benjamina Sterlingsa, naprawdę chciałem dodać ten efekt do. Wielkie dzięki dla Bena za to, że mi pozwoliłeś. To demo wyjaśnia, jak łatwo jest używać opcji cyklu jQuery, a także niektóre z najlepszych rozwiązań Maximage 2.0. Możesz zobaczyć, w jaki sposób używane są funkcje wywołania zwrotnego, jak również prędkość, czas, limit czasu, stronicowanie i naprawdę dowolną inną opcję cyklu jQuery. To demo korzysta również z niestandardowej funkcji pomocnika Maximage 2.0, która pozwala zmaksymalizować dowolny element pokazu slajdów, jak obrazy tła na slajdach. W tym przypadku maksymalizujemy wideo HTML5 w naszym pokazie slajdów, a także wideo YouTube. Chciałem pokazać sposób, w jaki Maximage2 umożliwia maksymalizowanie obrazów w obrębie elementów, a nie tylko okna przeglądarki. Po prostu przekazujesz selektor do opcji fillElement Maximage2s i jesteś gotowy. Używa również innego fx z cyklu jQuery, aby pokazać, jak łatwo to jest. BackgroundSize Maximage2 może być ciągiem (zawierającym lub zawierającym), aby określić, w jaki sposób obraz wypełnia kontener. Okładka wypełnia każde dostępne miejsce obrazem, ale zawiera maksymalnie obraz w przestrzeni, ale nie przekracza przestrzeni. Będą to dwa najczęstsze scenariusze, ale bardzo możliwe, że ktoś potrzebuje innej funkcjonalności. Cóż, Maximage2 pozwala ci napisać tutaj swoją własną funkcję i jest to przykład tego, jak to się robi. Uwaga: ten przykład jest przeznaczony dla użytkowników zaawansowanych. Pamiętaj, że dzięki FillElement możesz często bardzo łatwo wykonać schemat przesunięcia. po prostu ustaw element zawierający, w którym chcesz wyświetlać obrazy. Ponieważ pierwszą zasadą Maximage 2.0 jest próba pozostania rękami i zejściem z drogi, wbudowana obsługa przesunięć została zerwana w wersji 2.0. To nie znaczy, że nie są możliwe. Dzięki niewielkiemu smukłowi kolanowemu nadal można je wykonać (i są lepsze). To, co robię z poniższym kodem, polega na tworzeniu przesunięć kurtyn, które znajdują się przed pokazem slajdów. Nazywam te zasłony. Zrobiłem to z HTML i CSS poniżej dla 100px offsetów na górnej, prawej, dolnej i lewej krawędzi ekranu. Gdy już mamy zasłony, pokaz slajdów wciąż zmienia się do pełnego okna i chcemy go zmaksymalizować w widocznym obszarze. nasz rozmiar okna minus nasze przesunięcia. Z tego powodu musisz dostosować funkcję, która zmienia rozmiar okna. Możemy to zrobić za pomocą opcji backgroundSize, która zostanie przekazana do Maximage. Wystarczy ustawić ustawienia verticalOffset i horizontalOffset w backgroundSize (przykład JS poniżej), aby zmienić rozmiar obrazów pokazu slajdów w widocznym obszarze. Aby obrazy zawarte w przesunięciach po prostu zamieniały się na podstawie wysokości, w oparciu o reguły szerokości w funkcji backgroundSize w ten sposób: Maximage2 może być użyty jako narzędzie do prawie łatwego uczynienia prawie dowolnego elementu tła pełnoekranowego. Ten przykład pokazuje, jak można go użyć do utworzenia tła HTML5 wideo. UWAGA: Przekroczenie wideo w HTML5 dla wzmacniacza IE7 IE8 obecnie nie wypełnia ekranu w pokazie slajdów. Pracuję nad tym obecnie, ale jeśli jest to dla ciebie ważne, skorzystaj na razie z innego pokazu slajdów i sprawdź aktualizacje, ponieważ okazało się to bardziej złożone niż się spodziewano.
No comments:
Post a Comment