Commit 68031c01 authored by o@immerda.ch's avatar o@immerda.ch
Browse files

initial version

parents
var style = `
.ipick-button.ipick-open {
right: calc(6cm - 150px);
width: 300px;
}
.ipick-menu.ipick-open {
display: block;
}
.ipick-button {
position: absolute;
right: 0;
bottom: 0;
background-image: url("logo.png");
width: 150px;
height: 214px;
}
.ipick-menu {
position: absolute;
bottom: 0;
right: 0;
display: none;
height: 100%;
width: 6cm;
background-color: #222;
filter: alpha(opacity=75);
opacity: 0.75;
clip-path: polygon(100% 0%, 0% 0%, 0% calc(100% - 214px), 150px calc(100% - 214px), 150px 100%, 100% 100%);
}
.ipick-menu ul {
bottom: 200px;
position: absolute;
}
.ipick-menu ul li a {
color: green;
font-size: 20pt;
}
`;
var styleDom = document.createElement("style");
styleDom.innerHTML = style;
document.body.appendChild(styleDom);
var menu = document.createElement("div");
menu.className = "ipick-menu";
menu.innerHTML = `
<ul>
<li><a href="https://webmail.immerda.ch">webmail</a></li>
<li><a href="https://users.immerda.ch">konto</a></li>
<li><a href="https://docs.immerda.ch">hilfe</a></li>
</ul>
`;
document.body.appendChild(menu);
function openMenu() {
menu.className = "ipick-menu ipick-open";
b.className = "ipick-button ipick-open";
b.onclick = closeMenu;
}
function closeMenu() {
menu.className = "ipick-menu";
b.className = "ipick-button";
b.onclick = openMenu;
}
var b = document.createElement("div");
b.className = "ipick-button";
b.onclick = openMenu;
document.body.appendChild(b);
This diff is collapsed.
logo.png

28.1 KB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body style="background-color: green;">
<script src="ipick.js"></script>
</body>
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment