Page 1 of 1
Keep background for all pages after it is set
Posted: 01 Apr 2020, 01:09
by JanMolendijk
Hello Coursesweb I`m buisy to setup an darkmode for my website
But when I wanna use an hyperlink to another page I would like
to set automatic the darkmode without hitting mousebutton
every time on new page for the darkmode.
I use this simple script .column commes just from a class
Code: Select all
<script>
function setBg0() {
elem = document.querySelector(".column");
elem.style.background = "white";
elem.style.color = "black";
}
</script>
& This is the button to set the darkmode
Code: Select all
<a href='#' onclick='setBg0()'><t style='color: #ffffff; font-size: 12px; background-color: #ffffff'>w</t></a>
But how can I use the darkmode from an other page directly setted in an url ????
When I click the darkmode for the same page their aply an #
Like this: read.php?id=919&title=popup-modal-examples#
Keep background for all pages after it is set
Posted: 01 Apr 2020, 07:50
by Admin
Hello,
Try with
localStorage object; replace your script with this one:
Code: Select all
<script>
function setBg0(){
elem = document.querySelector(".column");
elem.style.background = "white";
elem.style.color = "black";
localStorage.setItem('set_bg0', 'bg0');
}
if('set_bg0' in localStorage) setBg0();
</script>
Keep background for all pages after it is set
Posted: 03 Apr 2020, 04:49
by JanMolendijk
Thanks for the support I tried things with locale storage
but it does not save correctly
Code: Select all
<script>
function setBg2() {
elem = document.querySelector(".column");
elem1 = document.querySelector(".column1");
elem.style.background = "black";
elem1.style.background = "black";
elem.style.color = "green";
elem1.style.color = "green";
localStorage.setItem("set_bg2", "bg2");
}
if("set_bg2" in localStorage) setBg2();
</script>
<script>
// https://www.w3schools.com/jsref/prop_style_fontsize.asp
// element options address
function setBg0() {
elem = document.querySelector(".column");
elem1 = document.querySelector(".column1");
elem.style.background = "white";
elem1.style.background = "white";
elem.style.color = "black";
elem1.style.color = "black";
localStorage.setItem('set_bg0', 'bg0');
}
if('set_bg0' in localStorage) setBg0();
</script>
I tried for local storage also those 2 scripts under
Code: Select all
<script>
((nm, tm) => {
const lStorage = localStorage;
const sStorage = sessionStorage;
const tabId = sStorage.getItem(tm)
|| ((newId) => {
sStorage.setItem(tm, newId);
return newId;
})((Math.random() * 1e8).toFixed());
const update = (setTabValue) => {
let currentValue = JSON.parse(lStorage.getItem(nm) || '{}');
const arrValue: number[] = Object.values(currentValue);
if (setTabValue
&& typeof currentValue[tabId] === 'undefined'
&& !arrValue.reduce((sum, current) => { return sum + current; }, 0)) {
lStorage.clear();
currentValue = {};
}
currentValue[tabId] = setTabValue;
lStorage.setItem(nm, JSON.stringify(currentValue));
};
update(1);
window.onbeforeunload = () => { update(0); };
})('tabs', 'tabid');
</script>
Code: Select all
<script>
$(window).unload(function(){
localStorage.clear();
});
</script>
Keep background for all pages after it is set
Posted: 03 Apr 2020, 06:20
by Admin
Sorry, I can't help more regarding that issue.
Keep background for all pages after it is set
Posted: 08 Apr 2020, 18:35
by JanMolendijk
Thanks for the support, after long searching I found a tool for every font-color + background-color
it even store all things with cookies so I left the local-storage
Keep background for all pages after it is set
Posted: 09 Apr 2020, 06:32
by Admin
I'm glad you succeeded.
What tool have you found?
Keep background for all pages after it is set
Posted: 09 Apr 2020, 11:43
by JanMolendijk
Dear admin I wanted to post the tool allready here
Hard to find the address but I have it now
Colourpicker bron:
https://www.w3.org/WAI/WCAG20/Technique ... /index.php
Keep background for all pages after it is set
Posted: 09 Apr 2020, 15:15
by JanMolendijk
I thought about this meight you can make a rubric
for scripts + tips from others meight it is usefull
Sometimes I surf for something specifiek & thinking about coursesweb
well this & that could also be handy for your website etcetra....