Bonjour,
Dans la balise head, je déclare 2 fichiers css afin de les alterner pour obtenir un effet darkmode,
je précice que j'ai opté pour cette solution parmi tant d'autres pour des raisons de compatibilité
entre navigateurs, car certains utilisateur utilisent encore ie11 et d'autres safari 5, bref...
tout fonctionne sauf sur safari... voici le code très simple
Dans la balise head, je déclare 2 fichier css... 1 pour les couleurs clairs, 1 pour les couleurs foncés... :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2 <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="stylesheet" type="text/css" href="style-dm.css" />
Ensuite, je place un bouton test :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part <p><button id="testchangecss">test</button></p>
Puis dans un fichier javascript, j'intercepte l'événement :
CSS style.css :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9 $(document).ready(function() { $('#testchangecss').on('click',function() { $('link[href*="style.css"]').prop('disabled', true); $('link[href*="style-dm.css"]').prop('disabled', false); });
CSS style-dm.css :
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 html, body { color: red; }
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 html, body { color: red; }
La couleur du texte change bien sauf sur safari..
merci d'avance pour votre aide.
Partager