Eye-Able®-apuohjelmisto on oletusarvoisesti integroitu verkkosivustoon kiinteänä kuvakkeena suhteessa näkymään. Tämä näkyvä sijainti yhdessä suurikontrastisten kuvakkeiden kanssa on osoittautunut käyttäjätesteissä helppokäyttöiseksi myös vaikeasti näkövammaisille käyttäjille. Eye-Able® voidaan kuitenkin myös upottaa ongelmitta suoraan verkkosivustoon. Tämä mahdollistaa integroinnin navigointipalkkiin tai muihin olemassa oleviin säiliöihin.
Mitä tahansa sivulla olevaa elementtiä voidaan käyttää tavallisen kuvakkeen vaihtoehtona. Tavallisen kuvakkeen "avaa ja sulje"-toiminnot on liitetty tähän elementtiin. Uusi kohde-elementti on luotava tai mukautettava tätä varten!
Linkin luomiseksi uuteen kohde-elementtiin on lisättävä CSS-tunnus"eyeAble_customToolOpenerID". Heti kun sivulla on elementti, jolla on tämä ID, tavallinen logo piilotetaan ja tapahtumaan lisätään vastaava EventListener. Työkalupalkin sijainti on edelleen siinä, missä se olisi tavallisen logon kanssa.
Jos useita avaus-/sulkupainikkeita halutaan upottaa, CSS-luokka "eyeAble_customToolOpenerClass"." voidaan myös käyttää. Käyttäytyminen on identtinen CSS ID -menetelmän kanssa.
Huomautus: Kaikilla alasivuilla, joilla ei ole tällaista elementtiä, jolla on eyeAble_customToolOpenerID ID tai eyeAble_customToolOpenerClass-luokka tavallinen logo näytetään edelleen!
Jos Eye-Able halutaan linkittää johonkin sivulla olevaan elementtiin piilottamatta päälogoa, merkintä "eyeAble_customToolOpenerNoHideClass"." CSS-luokkaa voidaan käyttää.
Eye-Able-työkalurivi on mahdollista avata myös suoraan linkin kautta. Tätä varten aseta linkin kohteeksi yksinkertaisesti "javascript:EyeAbleAPI.toggleToolbar()".
Varmista, että Eye-Able-yhteyspisteeseen pääsee näppäimistöllä ja että sen teksti on ruudunlukijoiden käytettävissä. Mahdollinen merkintä voisi olla: "Avaa visuaalisen avun ohjelmisto. Pääsee näppäimistöllä ALT + 1"
Demonstraatiotarkoituksessa tämä upotus on toteutettu tällä sivulla seuraavalla logolla:
Voit ladata ja upottaa Eye-Able-logon täältä (tai SVG-muodossa täältä):