您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Améliore l'accessibilité des sites web pour les utilisateurs malvoyants.
当前为
- // ==UserScript==
- // @name AccesSight
- // @namespace http://tampermonkey.net/
- // @version 0.1
- // @description Améliore l'accessibilité des sites web pour les utilisateurs malvoyants.
- // @author YGL, Benjamin Moine
- // @include *
- // @grant GM_getValue
- // @grant GM_setValue
- // @grant GM_deleteValue
- // @license Gnu GPL 3.0.
- // ==/UserScript==
- (function() {
- 'use strict';
- // Ressources de traduction pour les différentes langues
- const translations = {
- fr: {
- appTitle: "AccesSight",
- functionality1: "Fonctionnalité 1",
- functionality2: "Fonctionnalité 2",
- functionality3: "Fonctionnalité 3",
- // Ajoutez les autres traductions ici...
- },
- en: {
- appTitle: "AccesSight",
- functionality1: "Functionality 1",
- functionality2: "Functionality 2",
- functionality3: "Functionality 3",
- // Ajoutez les autres traductions ici...
- },
- // Ajoutez les autres langues ici...
- };
- // Fonction pour détecter la langue de l'utilisateur
- function detectUserLanguage() {
- const userLanguage = navigator.language || navigator.userLanguage;
- return userLanguage.split("-")[0];
- }
- // Langue par défaut
- const defaultLanguage = 'fr';
- // Langue de l'utilisateur
- const userLanguage = detectUserLanguage();
- // Initialisation de i18next avec la langue détectée
- i18next.init({
- lng: userLanguage || defaultLanguage,
- resources: translations,
- fallbackLng: defaultLanguage
- });
- // Fonction pour changer la langue
- function changeLanguage(lang) {
- i18next.changeLanguage(lang);
- }
- // Création du menu pour choisir la langue
- const languageMenu = document.createElement('div');
- languageMenu.innerHTML = `
- <select id="languageSelect">
- <option value="fr">Français</option>
- <option value="en">English</option>
- <!-- Ajoutez les autres langues ici -->
- </select>
- `;
- languageMenu.style.position = 'fixed';
- languageMenu.style.top = '20px';
- languageMenu.style.right = '20px';
- document.body.appendChild(languageMenu);
- // Événement pour changer la langue lorsque l'utilisateur choisit une option
- document.getElementById('languageSelect').addEventListener('change', function() {
- const selectedLanguage = this.value;
- changeLanguage(selectedLanguage);
- });
- // Styles pour l'interface utilisateur
- const styles = `
- /* Fond sombre pour l'application */
- body {
- background-color: #0f1c29;
- color: #fff; /* Couleur du texte */
- }
- /* Menu utilisateur */
- header {
- background-color: #1f364d;
- border-radius: 10px;
- padding: 20px;
- position: fixed;
- top: 20px;
- right: 20px;
- z-index: 1000;
- }
- /* Liens du menu */
- nav ul {
- list-style-type: none;
- padding: 0;
- }
- nav ul li {
- display: inline;
- margin-right: 10px;
- }
- nav ul li a {
- color: #fff;
- text-decoration: none;
- padding: 5px 10px;
- border-radius: 5px;
- transition: background-color 0.3s ease;
- }
- nav ul li a:hover {
- background-color: #2e4a62;
- }
- /* Contenu principal */
- main {
- margin-top: 100px; /* Pour éviter que le contenu ne soit caché par le header */
- }
- /* Pied de page */
- footer {
- background-color: #1f364d;
- text-align: center;
- padding: 20px;
- color: #fff;
- clear: both;
- }
- `;
- // Injecter les styles dans la page
- const styleElement = document.createElement('style');
- styleElement.textContent = styles;
- document.head.appendChild(styleElement);
- // Balises sémantiques pour améliorer l'accessibilité
- const headerElement = document.createElement('header');
- headerElement.innerHTML = `
- <h1>${i18next.t('appTitle')}</h1>
- <nav>
- <ul>
- <li><a href="#fonctionnalite1">${i18next.t('functionality1')}</a></li>
- <li><a href="#fonctionnalite2">${i18next.t('functionality2')}</a></li>
- <li><a href="#fonctionnalite3">${i18next.t('functionality3')}</a></li>
- </ul>
- </nav>
- `;
- document.body.prepend(headerElement);
- const mainElement = document.createElement('main');
- mainElement.innerHTML = `
- <section id="fonctionnalite1">
- <h2>${i18next.t('functionality1')}</h2>
- <p>Description de la fonctionnalité 1.</p>
- </section>
- <section id="fonctionnalite2">
- <h2>${i18next.t('functionality2')}</h2>
- <p>Description de la fonctionnalité 2.</p>
- </section>
- <section id="fonctionnalite3">
- <h2>${i18next.t('functionality3')}</h2>
- <p>Description de la fonctionnalité 3.</p>
- </section>
- `;
- document.body.appendChild(mainElement);
- const footerElement = document.createElement('footer');
- footerElement.innerHTML = `<p>${i18next.t('appTitle')} - Tous droits réservés</p>`;
- document.body.appendChild(footerElement);
- })();