Browser-Update.org

Verkkosivustojen yhteishanke jonka tarkoituksena on informoida käyttäjiä selainpäivitysten tärkeydestä

Mukauta ja testaa

Testaa koodi

Lisäämällä verkko-osoitteeseen #test-bu, näytetään ilmoitus aina. Esimerkki: http://browser-update.org/#test-bu. Varmista että sivu ladataan kokonaan uudelleen, avaamalla osoite selaimen uudessa välilehdessä. lisätietoja (englanniksi)

Valinnat

Seuraavat vaihtoehdot voidaan välittää koodille:

$buoop = {
    required: {i:8,f:25,o:17,s:9,c:22},
    // Määrittää vaaditut selain versiot
    // Tätä vanhempi selain saa huomautuksen.
    // f:22 ---> Firefox < 22 huomautetaan
    // Negatiiviset numerot määrittävät kuinka monta versiota jäljessä nykyisestä.
    // c:-5 ---> Chrome < 35  huomautetaan jos viimeisin Chrome versio on 40.
    // lisätietoja (englanniksi)
    
    reminder: 24,
    // monenko tunnin päästä ilmoituksen tulisi näyttää uudelleen
    // 0 = näytä aina

    reminderClosed: 150,
    // jos käyttäjä sulkee viestin se näytetään uudelleen x tunnin jälkeen

    onshow: function(infos){},
    onclick: function(infos){},
    onclose: function(infos){},
    // callback toiminnot kun ilmoitus on näytetty / klikattu / suljettu

    l: false,
    // aseta kiinteä kielivalinta viestille, esim "en". Tämä yliajaa oletusarvon tunnistuksen.

    test: false,
    // true = näytä ilmoitus aina (koekäyttö)

    text: "",
    // mukautettu ilmoitus teksti (html)
    // Paikkamerkit {brow_name} korvataan selaimen nimellä, {up_but} päivitys linkin sisällöllä sekä {ignore_but} mykistyksen linkin sisällöllä.
    // Esimerkki: "Selaimesi {brow_name} on liian vanha <a{up_but}>päivitä</a>, tai <a{ignore_but}>mykistä</a>."
    // lisätietoja (englanniksi)

    text_in_xx: "",
    // mukautettu ilmoitus teksti, kielelle "xx"
    // esim: text_de saksalle sekä text_it italialle

    newwindow: true,
    // avaa linkki uudessa ikkunassa/välilehdessä

    url: null,
    // osoite johon ilmoituksen klikkaaminen johtaa

    noclose:false,
    // Älä näytä "mykistä" nappia ilmoituksessa

    nomessage: false,
    // Älä näytä viestiä jos selain on vanhentunut, kutsu ainoastaan onshow callback toimintoa

    jsshowurl: "//browser-update.org/update.show.min.js",
    // URL jossa koodi, joka näyttää ilmoituksen, sijaitsee. Tämä ladataan ainoastaa mikäli käyttäjällä todella on vanhentunut selain.

    container: document.body,
    // DOM Elementti johon huomautus injektoidaan.

    no_permanent_hide: false
    // Älä anna käyttäjän mykistää ilmoitusta pysyvästi

    api: xxx
    // Tämä on browser-update rajapinnan (API) käytettävä version. Älä poista.

};
Parametri Kuvaus Arvot Oletusarvo Tyyppi
style Ilmoituksen sijainti. Vaihtoehdot: "top", "bottom", "corner" "top", "bottom", "corner" "top" string
shift_page_down Shift down the page in order not to obscure content behind the notification bar. Adds margin-top to the <body> tag. true, false true boolean
notify_esr Also notify Firefox ESR (Extended Support releases) versions if they are below requirement - although they are still supported. Default is to not notify them. They are supported by mozilla for about a year after their initial release. true, false false boolean
text mukautettu ilmoitus teksti (html)
lisätietoja (englanniksi)
text: { 'msg':'Your web browser ({brow_name}) is out of date.', 'msgmore': 'Update your browser for...', 'bupdate': 'Update browser', 'bignore': 'Ignore', 'remind': 'You will be reminded in {days} days.', 'bnever': 'Never show again' } dictionary or string
text_for_x custom notification text for browser x
lisätietoja (englanniksi)
undefined dictionary or string
text_in_xx mukautettu ilmoitus teksti, kielelle "xx"
esim: text_de saksalle sekä text_it italialle
lisätietoja (englanniksi)
undefined dictionary or string
text_for_x_in_xx custom notification text for browser x in language xx
text_for_i: {'msg':'Internet Explorer is not supported on this site.'}
undefined dictionary or string
nostatistics For every 1000th visitor anonymous statistics on the used browser are collected.
Turns off sending anonymous statistics.
true, false false boolean

Muuta ulkoasua

Seuraavat CSS säännöt asetetaan ilmoituksen toimesta. Voit ylikirjoittaa ne omalla CSS määrityksellä, lisäämällä määrityksiä css-sääntöihin, kuten: body .buorg {font-size:20px}



    .buorg {
        position: absolute;
        position: fixed;
        z-index: 111111;
        width: 100%;
        top: 0px;
        left: 0px;
        border-bottom: 1px solid #A29330;
        text-align: center;
        color: #000;
        background-color: #fff8ea;
        font: 18px Calibri, Helvetica, sans-serif;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        animation: 1s ease-out 0s buorgfly
    }

    .buorg-pad {
        padding: 9px;
        line-height: 1.7em;
    }

    .buorg-buttons {
        display: block;
        text-align: center;
    }

    #buorgig, #buorgul, #buorgpermanent {
        color: #fff;
        text-decoration: none;
        cursor: pointer;
        box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
        padding: 1px 10px;
        border-radius: 4px;
        font-weight: normal;
        background: #5ab400;
        white-space: nowrap;
        margin: 0 2px;
        display: inline-block;
    }

    #buorgig {
        background-color: #edbc68;
    }

    @media only screen and (max-width: 700px) {
        .buorg div {
            padding: 5px 12px 5px 9px;
            line-height: 1.3em;
        }
    }

    @keyframes buorgfly {
        from {
            opacity: 0;
            transform: translateY(-50px)
        }
        to {
            opacity: 1;
            transform: translateY(0px)
        }
    }

    .buorg-fadeout {
        transition: visibility 0s 8.5s, opacity 8s ease-out .5s;
    }

    .buorg-icon {
        width: 22px;
        height: 16px;
        vertical-align: middle;
        position: relative;
        top: -0.05em;
        display: inline-block;
        background: no-repeat 0px center;
    }