Die ontwikkeling van uitbreidings vir Google Chrome - HTML en struktuur Uitbreiding
In hierdie video sien ons hoe om die visuele styl pop uitbreiding met CSS definieer
Die ontwikkeling van uitbreidings vir Google Chrome 04: HTML en struktuur Uitbreiding
Vir een keer het deel van die aanvanklike opset parameters wat toelaat dat die werking van die ontwikkeling begin, sê: 'frontend 'n uitbreiding, sodat ons begin met die HTML-lêer, die 'pop-up', en dit is wat dit toelaat, sal die vertoning van die uitbreiding het, al is dit reeds geïnstalleer weet waarvan ek praat, en sien ook hoe dit sal begin om die struktuur van die volle omvang. Jy Ithan verduidelik.
Hi, ek is Ithan en ons sal voortgaan om video's as 'n uitbreiding vir Google Chrome. Goed, nou kom ons begin met die moeite werd om 'popup.html, ons sal moet ... wel, kom ons doen dit, as jy HTML en gee 'n 'oop' en maak jy die basiese struktuur in titel I hoef nie enigiets te sit, direk verwyder, Belangrike!, die 'karakterstel 'om te sê dat ons wil teks formaat te gebruik, maar die aksent is nie ons waarskynlik sal werk,
dan, hier en in die 'kop', sodat dit vragte vinnig, ons 'script' ... oops!, spelfoute, 'src', 'gelyke' en sit 'src', 'bar', 'jQuery' punt '' JS ', sluit ons die' tag '(dankie, ek wil nie te koop), en check dit met dieselfde naam, alles reg, okay voortgaan, Ons sal die 'styl' uitbreidings te doen, dit moet gedoen word in jou eie 'kop' van HTML, sodat ons verlaat hier en 'n ruimte om visuele style CSS het,
dan voort te gaan met die 'liggaam', sal ons basies nodig, as jy hier kan sien ek het, die uitbreiding (het dit nie op om te sien ... in staat te stel), Ek het dit hier, en as jy sien ek het so 'n 'iframe 'reg?, Die video, maar as jy kyk, jy nie' hover 'sien jy?, Doen ... Ek bedoel, dit is soos 'n praat prent , Dit maak geen interaksie met die video, en dit is omdat bo 'n 'div' gelê het, sodat wanneer 'clickees 'in plaas van playte die video hier,
(Soos wanneer jy die video neem as dit is en wat jy doen 'n 'iframe), maar wanneer' clickas 'in die' div, open hierdie blad met die 'link' na hierdie video, en sien?, as jy sien, hier is dit dat wanneer jy sit bo die sleutelbord, of die muis oor, ja dit effek 'hover' wat rooi knoppie. En dan, hier het ek 'n knoppie instellings, waar jy kan kies watter kanaal, maar in hierdie geval ... Wel, nie as hierdie tutoriale sal verduidelik dit waar is,
hoe om dit te doen met verskillende kanale, sowel ... dan moet ons doen 'n 'div', en die 'ID' ons sal noem 'onclick' so ons het baie duidelik wat, Klas' is gelyk aan 'n skakel ', dan is dit die klas langer te gebruik, en dan sit ons dit hier dat dit makliker te maak, en ons sit' wyser ',' script ',' gebeurtenisse ', en ons sit motor ',' belangrike ', dit nou net nie verstaan ​​hoekom nie, maar nou sal ek verduidelik in 'n oomblik waarom ek goed sit dit.
Goed, ons ook gaan hê om 'n 'script' wat die soeke na die video-kanaal sal word en sit dit in die 'iframe, hierdie' script 'gaan wees,' src ' en ons sal die 'script' noem, 'getvideos.js' volgens (wat gebeur het?), O!, het ek 'styl' (Jo ***, wat 'n dag ...) om te sien voortgaan, en ons sal 'n beeld het die 'id' knoppie te wees, 'instellings', 'img' byvoorbeeld, 'n klas ', ons gaan doen' Stellings 'en' src ', moet u 'n beeld te sit,
en ons sal sit, 'src', 'bar', 'settings', 'punt', 'png. En nou, julle sê, en hierdie foto van waar jy kry?, Dan, my uitvinding, die soek aanlyn, jy doen met die 'Photoshop' met die 'Adobe Illustrator 'wat jy wil. En baie belangrik! (Eh ... daar is geskrywe met twee 'e'), maar dit is baie irriterende om te gaan na 'clickar' en sleep die beeld, en hulle het 'n 'skakel' om die beeld oop deur te sleep. As jy hierdie sit,
werk soos 'n knoppie op 'n program, kan jy nie sleep die beeld of 'n seldsame, volgens dinge, hierdie, sal ons dit 'n bietjie beter keep, okay. So jy sien, ek het nog al, die beeld van 'Stellings', jy het om te kyk vir een, sou so 'n beeld, enige simbool wat die idee van 'setup, en goed, voort te gaan in die volgende video.