change wp
BIN
bg/crystal.png
Normal file
|
After Width: | Height: | Size: 9.2 KiB |
|
Before Width: | Height: | Size: 437 KiB After Width: | Height: | Size: 437 KiB |
BIN
bg/konata.png
Normal file
|
After Width: | Height: | Size: 179 KiB |
BIN
bg/lain.png
Normal file
|
After Width: | Height: | Size: 3 MiB |
BIN
bg/mary_and_gabriel.png
Normal file
|
After Width: | Height: | Size: 1.5 MiB |
BIN
bg/sakura.jpg
Normal file
|
After Width: | Height: | Size: 529 KiB |
BIN
bg/squirtle.gif
Normal file
|
After Width: | Height: | Size: 138 KiB |
56
index.html
|
|
@ -6,6 +6,18 @@
|
|||
</head>
|
||||
|
||||
<body>
|
||||
<div class='settings'>
|
||||
<select name="dropdown" id="dropdown">
|
||||
<option value="">set bg</option>
|
||||
<option value="frogs">frogs</option>
|
||||
<option value="mary">mary</option>
|
||||
<option value="crystal">crystal</option>
|
||||
<option value="konata">konata</option>
|
||||
<option value="lain">lain</option>
|
||||
<option value="sakura">sakura</option>
|
||||
<option value="squirtle">squirtle</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="link-container">
|
||||
<div id="main" style='display:block'>
|
||||
|
|
@ -44,6 +56,50 @@
|
|||
|
||||
<script>
|
||||
|
||||
function getCookie(cname) {
|
||||
let name = cname + "=";
|
||||
let decodedCookie = decodeURIComponent(document.cookie);
|
||||
let ca = decodedCookie.split(';');
|
||||
for(let i = 0; i <ca.length; i++) {
|
||||
let c = ca[i];
|
||||
while (c.charAt(0) == ' ') {
|
||||
c = c.substring(1);
|
||||
}
|
||||
if (c.indexOf(name) == 0) {
|
||||
return c.substring(name.length, c.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
var bg = getCookie("bg")
|
||||
console.log(bg)
|
||||
if (bg != "" && bg != 'undefined') {
|
||||
changeWallpaper(bg)
|
||||
}
|
||||
|
||||
function changeWallpaper(bg) {
|
||||
document.cookie = "bg=" + bg;
|
||||
|
||||
var bg_map = {
|
||||
'frogs': 'frogs.jpg',
|
||||
'mary': 'mary_and_gabriel.png',
|
||||
'crystal': 'crystal.png',
|
||||
'konata': 'konata.png',
|
||||
'lain': 'lain.png',
|
||||
'sakura': 'sakura.jpg',
|
||||
'squirtle': 'squirtle.gif'
|
||||
}
|
||||
|
||||
document.body.style.backgroundImage = "url('bg/"+ bg_map[bg] +"')";
|
||||
}
|
||||
|
||||
document.getElementById("dropdown").addEventListener("change", function () {
|
||||
if (this.value != "") {
|
||||
changeWallpaper(this.value);
|
||||
}
|
||||
});
|
||||
|
||||
var key_map = {
|
||||
'a': 'https://wiki.archlinux.org/',
|
||||
'd': 'https://www.domdit.com',
|
||||
|
|
|
|||
15
style.css
|
|
@ -1,5 +1,5 @@
|
|||
body {
|
||||
background-image: url("bg.jpg");
|
||||
background-image: url("bg/frogs.jpg");
|
||||
background-size: cover;
|
||||
font-family: monospace, monospace;
|
||||
font-size: 25px;
|
||||
|
|
@ -10,6 +10,19 @@ table, th, td {
|
|||
border: 1px solid black;
|
||||
}
|
||||
|
||||
.settings {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
option, select {
|
||||
width: 70px;
|
||||
font-family: monospace, monospace;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||