Geschreven door Tobias Greiner op 01 augustus 2023

Integration with dynamic reloading

Accessibility

Integration with dynamic reloading

Code in different colours is depicted.In addition to loading the Eye-Able assets directly from the Eye-Able or local server, it is also possible to load the data from Eye-Able by clicking on the icon. This has the advantage that only users of the site who also interact with Eye-Able connect to the server and load the Javascript files. This integration also has advantages in terms of data protection, as the user is informed of this outgoing connection before contacting the Eye-Able server.Depiction of the Eye-Able visual Help logoNote for users who have not yet used Eye-Able

The first time Eye-Able is used, a local storage entry is set. Once this entry is set, Eye-Able will be loaded automatically the next time you visit the page.

Integration into the HTML of the page

To integrate Eye-Able, all you need to do is place the JavaScript file in the HTML of the page using a <script> element. You can either upload the JavaScript file and then reference it:Code to integrate Eye-AbleExample of the integration of the JavaScript file after previous upload

You can also include the code from the javascript file inline in a <script> element:Example of an inline integration of the formatted code

Functions for dynamic reloading and the Eye-Able icon are integrated directly into the page via the Javascript file. You can also determine the position of the Eye-Able icon yourself. To do this, change the following variables at the beginning of the code:

  • eA_top : Changes the top position of the icon e.g. "15%", or "250px".

  • eA_side: Changes the lateral position of the icon: "left" or "right".

  • eA_bottom: Changes the bottom position of the icon on mobile devices e.g. "15%".Depiction of CodePart of the integration code to adjust the position

Sebastian Fjeld

Sebastian Fjeld has been part of the team as a professional voiceover artist and copywriter at Eye-Able® since the beginning. He studied voice acting at a university and was trained by actors. Currently he is completing his education as an interpreter for various languages.

More contributions

If it may be a little more

Filter

Filter op categorie

Bevestig je selectie met de knop aan het einde van de lijst na het kiezen van de categorieën.

Filters resetten
Bovenaanzicht van een laptop waarop een website wordt getoond, met twee handen die op het toetsenbord typen. Links naast de laptop staat een blauw toegankelijkheidspictogram met een persoon-icoon.

"Digitale toegankelijkheid is nu geen prioriteit" - en dat kost je elke dag omzet

Lees verhaal
iPhone en Apple Watch met toegankelijkheidsfuncties in beeld. Op het iPhone-scherm zijn opties zoals Live luisteren, geluidsniveau van koptelefoons en ondertiteling zichtbaar. Op de Apple Watch wordt live transcriptie getoond. Het toegankelijkheidssymbool en het Apple iPhone-logo benadrukken inclusieve functies voor gehoorondersteuning.

Toegankelijkheid iPhone: zo haal je alles uit de toegankelijkheidsinstellingen

Lees verhaal
Drie smartphoneschermen met een e-commerce-app. In het midden staat een productpagina voor de Sony WH-1000XM5 koptelefoon, links een overzicht met aanbiedingen en rechts het checkout-scherm met betaalopties. Het universele toegankelijkheidssymbool linksboven benadrukt toegankelijke online winkelervaringen.

Mobiele toegankelijkheid: ben jij er klaar voor?

Lees verhaal
Illustratie van een webpagina waarop tekst automatisch wordt omgezet naar eenvoudigere, beter leesbare content. Een pijl verbindt originele tekst met een vereenvoudigde versie, naast pictogrammen voor AI en een open boek, wat het herschrijven naar begrijpelijke en toegankelijke taal visualiseert.

AI accessibility: Hoe organisaties inclusieve digitale ervaringen maken

Lees verhaal

You need more informations?

Write to us and we will be happy to help you.

A man and a woman look at a monitor and laugh