Šodien darbā es saskāros ar nepieciešamību pēc tīmekļa lapas pilnekrāna displeja, tāpēc es pārbaudīju Baidu un atradu jQuery spraudni tīmekļa lapu pilnekrāna attēlošanai: jquery pilnekrāna spraudnis. Tas nodrošina tīmekļa lapu pilnekrāna attēlošanu dažādām pārlūkprogrammām, tostarp FF 10, Chrome un Safari, un tiek izmantots, lai lietotājiem nodrošinātu lasāmāku tīmekļa lapas versiju, kuru var mērogot <canvas>un <video>elementēt.
jQuery pilnekrāna spraudnis
Apraksts
Šis jQuery spraudnis nodrošina vienkārši lietojamu mehānismu, lai kontrolētu jauno pilnekrāna režīmu mūsdienu pārlūkprogrammās. Pašlaik šo jauno pilnekrāna funkciju nodrošina tikai jaunākas Webkit pārlūkprogrammas (piemēram, Chrome un Safari), Firefox un IE11+.
Lietošana
Pilnekrāna režīma ieiešana
Varat pārslēgt visu lapu vai vienu HTML elementu uz pilnekrāna režīmu:
$(dokuments).fullScreen(patiess);
$("#myVideo").fullScreen(true);
Tas darbojas tikai tad, ja kodu aktivizēja lietotāja mijiedarbība (piemēram, onclick notikums uz pogas). Pārlūkprogrammas neļauj ieslēgt pilnekrāna režīmu bez lietotāja mijiedarbības.
Iziešana no pilnekrāna režīma
Pilnekrāna režīms vienmēr tiek iziets, izmantojot dokumentu, bet šis spraudnis to atļauj arī caur jebkuru HTML elementu. Tad tiek izmantots atlasītā HTML elementa īpašnieka dokuments:
$(dokuments).fullScreen(nepatiess);
$("#myVideo").fullScreen(nepatiess);
Vaicāšana pilnekrāna režīmā
Vienkārši nenododiet nevienu argumentu pilnekrāna metodei, lai vaicātu pašreizējo stāvokli. Šī metode atgriež pašreizējo pilnekrāna elementu (vai true, ja pārlūkprogramma to neatbalsta), kad pilnekrāna režīms ir aktīvs, false, ja tas nav aktīvs, vai null, ja pārlūkprogramma neatbalsta pilnekrāna režīmu režīms vispār. Tātad jūs varat izmantot šo metodi arī, lai parādītu pilnekrāna pogu tikai tad, ja pārlūkprogramma atbalsta pilnekrāna režīmu:
$("#fullscreenButton").toggle($(dokuments).fullScreen() != null))
Pilnekrāna režīma pārslēgšana
Spraudnis nodrošina vēl vienu metodi vienkāršai pilnekrāna režīma pārslēgšanai:
$(dokuments).toggleFullScreen();
Paziņojumi
Spraudnis aktivizē pilnekrāna izmaiņu notikumu dokumentā, kad ir mainīts pilnekrāna režīms. Ja pārlūkprogramma noraidīja pilnekrāna stāvokļa maiņu, spraudnis dokumentā aktivizē pilnekrāna kļūdas notikumu. Piemērs:
$(dokuments).bind("pilnekrāna maiņa", funkcija() {
console.log("Pilnekrāna ekrāns" + ($(dokuments).fullScreen() ? " ieslēgts" : "izslēgts"));
});
$(dokuments).bind("pilnekrāna kļūda", funkcija() {
alert("Pārlūkprogramma noraidīja pilnekrāna izmaiņas");
});
Pilnekrāna iframe
Pilnekrāna režīma ievadīšana no iframe nav atļauta pēc noklusējuma, bet to var iespējot ar dažiem iframe atribūtiem:
<iframe src="iframe.html" webkitAllowFullScreen mozAllowFullScreen allowFullScreen>
</iframe>
Zināmās problēmas
IE 11 tiek parādīta tukša lapa, ievadot pilnekrāna režīmu no iframe. Nav ne jausmas, kāpēc. Jebkura palīdzība ir laipni gaidīta.
Pārlūkprogrammā Safari (vismaz Safari 7) pilnekrāna režīmā tastatūras ievade nav atļauta.
GitHub adrese: https://github.com/kayahr/jquery-fullscreen-plugin
Tūristi, ja vēlaties redzēt šīs ziņas slēpto saturu, lūdzu Atbildi
|
Publicēts 14.08.2017 16:34:52
|
|
|
Publicēts 14.08.2017 17:08:18
|
Publicēts 25.11.2017 14:35:17
|
