Fundacja Joyride
Joyride to efekt kreatora funkcji JavaScript, utworzyć instancję w następujący sposób:
Przykłady
<H3 id = "pierwszy"> Pierwszy przystanek! </ H3>
<H3 id = "drugi"> Drugi przystanek! </ H3>
<- The Joyride :! Musi być umieszczona w dolnej części strony, ale wewnątrz <body> ->
<class = "Joyride-lista Ol " data-Joyride>
<Li danych id = "first ">
<P> Pierwszy przystanek. Przejazd rozpoczął! </ P>
</ Li>
<Li danych id = "drugi ">
<H4> drugi przystanek </ h4 >
<P> Dowolny poprawny HTML będzie działać wewnątrz Joyride. </ P>
</ Li>
<Li danych = Przycisk "End ">
<H4> Koniec stop </ h4 >
<P> Trasa jest skończona. Można też wrócić do poprzedniego przystanku lub zamknąć ją. </ P>
</ Li>
</ Ol>
<! - Początek Joyride po inicjalizacji - >
<Script>
$ (Document) .ready (function () {
$ (Document) .foundation ( 'Joyride', 'start');
})
</ Script>
Przykłady analityczne
W powyższym przykładzie, tworzymy dwa elementy, z których każdy ma osobny identyfikator. Dwa elementy ustawia pozycji startowej i końcowej przejażdżkę.
My <ol> i <ul> , aby dodać element data-joyride mienia oraz .joyride-list klasę stworzyć przejażdżkę. Trzeba zdefiniować go w nagłówku dokumentu (w <body> w głowie). Stosowany na każdej listy <li> elementy, każde dodanie data-id=" value " atrybutu. Wartość atrybutu musi być taka sama przed elementem id. Więc pierwsza funkcja nawigacji <h3> elementu za pomocą id = "pierwszy" musi być data-id <li> elementu = "pierwszy" Umowa wartość.
Jeśli nie uda się zatrzymać id, wyświetli się okno modalne.
Wreszcie Joyride wymaga JavaScript, żeby go zainicjować, kod jest: $(document).foundation('joyride', 'start');