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
Woman with a tablet and world map in the background.

Eye-Able als alternatief: wat organisaties écht nodig hebben

Lees verhaal
Screenshot van het Eye-Able-dashboard waarin stap 1 van een formulier voor een toegankelijkheidsverklaring wordt ingevuld. Rechts is een automatisch gegenereerde Toegankelijkheidsverklaring zichtbaar met secties over naleving, dienstbeschrijving en niet-toegankelijke inhoud. De afbeelding toont hoe een HTML-toegankelijkheidsverklaring automatisch wordt aangemaakt op basis van ingevoerde gegevens.

Hoe kom ik aan een toegankelijkheidsverklaring voor de EAA?

Lees verhaal
Illustratie van een webinterface met het universele toegankelijkheidssymbool op de voorgrond. Rechts is een checklist met blauwe vinkjes zichtbaar, wat het controleren en voldoen aan toegankelijkheidsrichtlijnen voor digitale content en websites visualiseert.

Wat is Alt Tekst voor obstakelvrij lezen van beelden?

Lees verhaal
Illustratie van een webinterface met in het midden een pictogram met sterretjes, omringd door blauwe lijnen die verschillende onderdelen van de pagina verbinden. De afbeelding staat voor optimalisatie en verbetering van digitale content en gebruikerservaring.

Hoe AI een handje helpt bij de Wet Digitale Toegankelijkheid

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