screenfull.js Kullanarak Web Sitenizi Tam Ekran Yapın

screenfull.js ile web sitenizi ziyaret edenlere, tam ekran özelliği sağlayabilirsiniz.

Web sitenizi tam ekran olarak ziyaretçilerinize sunmak istiyorsanız bu eklenti tam sizlik. Fullscreen API ile hazırlanmış bu eklenti tüm browserlarda çalışmaktadır. Eklentiyi ücretsiz olarak GitHub üzerinden indirebilirsiniz.

Web sitenizi daha önce belirlediğiniz bir linke/butona basınca tam ekran yapmak için:

document.getElementById('button').addEventListener('click', () => {
    if (screenfull.enabled) {
        screenfull.request();
    } else {
        // Ignore or do something else
    }
});

 Belirli bir elementi tam ekran yapmak için:

const elem = document.getElementById('target');

document.getElementById('button').addEventListener('click', () => {
    if (screenfull.enabled) {
        screenfull.request(elem);
    }
});

 jQuery kullanarak tam ekran yapmak için:

const target = $('#target')[0]; // Get DOM element from jQuery collection

$('#button').on('click', () => {
    if (screenfull.enabled) {
        screenfull.request(target);
    }
});

 Toogle aracılığıyla belirli bir görseli tam ekran yapmak için:

$('img').on('click', event => {
    if (screenfull.enabled) {
        screenfull.toggle(event.target);
    }
});

Diğer örnekler için: https://github.com/sindresorhus/screenfull.js#fullscreen-the-page

Demo – Ücretsiz İndir