Rozwijające Rozszerzenia dla Google Chrome

Rozwijające Rozszerzenia dla Google Chrome 04: HTML i struktura Extension

11 filmy

88 minuty

Po raz pierwszy wykonana część początkowych parametrów konfiguracyjnych, które umożliwiają działanie rozwoju rozpoczyna się powiedzieć 'frontend' rozszerzenie, więc zaczęliśmy z plikiem HTML do 'popup', czyli to, co pozwala, widok będzie mieć rozszerzenie, jeśli jest zainstalowany już wiem, co mówię, a także zobaczyć, jak to zacznie strukturę w pełnym zakresie. You Ithan wyjaśnia.

Cześć, jestem Ithan i będziemy tworzyć filmy jako rozszerzenie dla Google Chrome. Dobra, teraz zacznijmy z wartości 'popup.html ' będziemy musieli ... Dobrze, zróbmy to, jeśli umieścisz kod HTML i dać 'zakładki', i sprawia, że ​​podstawowa struktura w tytule I nie trzeba kłaść, bezpośrednio go usunąć, Uwaga! The 'charset' powiedzieć, że chcemy wykorzystać format tekstowy, ale akcenty są prawdopodobnie nie będzie działać,

Następnie, tu w 'nagłówku', tak, że ładuje się szybko, my 'script' ... Ups, błędy ortograficzne, 'źródło', 'równe' i umieścić 'źródło', 'bar', '' jquery Punkt '' js ', zamykamy 'tag' (dzięki, nie chcę kupić) i sprawdzić to sama nazwa, wszystko w porządku, w porządku, dalej, dołożymy rozszerzenia 'styl', to musi być zrobione w swoim własnym 'nagłówku' HTML, więc zostawiamy tu i przestrzenią mieć wizualne style CSS,

Następnie przejdź do 'ciała', musimy w zasadzie, jak widać tutaj mam, rozszerzenie (nie ma go, aby zobaczyć ... włączyć) Mam go tutaj, i jak widać mam tak mówić 'iframe' prawda?, Wideo, ale jeśli spojrzeć, nie 'unosić' widzisz?, Nie ... To znaczy, to jest jak obrazek , Nie ma interakcji z wideo, a to dlatego, że wyżej wprowadziły 'div', tak, że gdy 'clickees' zamiast playte wideo tutaj

(Podobnie jak podczas robienia filmu jak to jest i zrobisz 'iframe), ale kiedy' clickas 'w' div ', otwiera tę zakładkę 'link' do tego filmu, i zobaczyć?, jak widać, o to, że kiedy można umieścić nad klawiaturą, lub myszkę, tak to jest efekt 'aktywowania', który zmienia kolor na czerwony przycisk. I wtedy, tutaj mam przycisk ustawień, w którym można wybrać kanał, ale w tym przypadku ... Dobrze, jeśli nie, te tutoriale wyjaśni to prawda,

jak to zrobić z różnych kanałów, dobrze ... potem zróbmy 'div' i 'id' będziemy nazywać 'onclick', więc mamy bardzo jasne, co jest, Klasa' jest równa 'link', to już korzystać z tej klasy, a następnie umieścić go tutaj, że jest to łatwiejsze i stawiamy 'wskaźnik', 'scenariusz', 'Wydarzenia' i kładziemy auto ',' ważne ', to teraz po prostu nie rozumiem dlaczego, ale teraz będę wyjaśnić, dlaczego w jednej chwili mogę umieścić to dobrze.

Dobra, mamy również będzie musiał umieścić skrypt '', który będzie poszukiwanie kanał wideo i umieścić go w 'iframe', ten 'skrypt 'będzie' src ' a my nazywamy 'skrypt', 'getvideos.js' według (co się stało?) Och, napisałem 'styl' (Dz ***, co za dzień ...), aby zobaczyć dalej, a my umieścić obraz będzie przycisk 'id', 'Ustawienia', 'img' na przykład, 'klasa', mamy zamiar zrobić 'Ustawienia' i 'src ', trzeba umieścić obraz,

a my mówiąc, 'źródło', 'bar', 'Ustawienia', 'punkt', 'png'. A teraz mówicie, i ten obraz, gdzie można uzyskać? Więc moja wynalazku, poszukiwania w internecie, zrobić z 'Photoshop' z 'Adobe Illustrator', co chcesz. I bardzo ważne! (Eh ... to jest napisane w dwa 'e'), ale jest to bardzo irytujące, aby przejść do 'clickar 'i przeciągnij obraz, a oni otworzyć' link 'do obrazu poprzez przeciąganie. Jeśli wstawisz ten,

działa jak przycisk na programie, nie można przeciągnąć obraz lub dokonać rzadkiej, zgodnie rzeczy, to będziemy go wciąć się trochę lepiej, okay. Więc widzisz, mam tu już obraz 'Ustawienia', trzeba spojrzeć na jeden, to taki obraz, dowolny symbol reprezentujący ideę 'konfiguracji, a także kontynuować w następnym filmie.

Aby znaleźć nowe kursy, zapisz. Nie będzie spam, obiecał :)

o autorze

foto de jotajotavm
José Javier Villena

Biografia: Analityk-Programmer w różnych językach. Platformy Opiekun PREMIUM rozpoznawane na całym świecie jako CodigoFacilito. Artykuły Edytor Cristalab. Mój kanał YouTube jest sponsorowany przez wydawcę Anaya LaTostadora. Lubię szczegółowo wyjaśnić i podać kilka przykładów dla uniknięcia wątpliwości.