Enhanced menu experience to ease the navigation

This commit is contained in:
VA3HDL 2024-05-26 19:09:24 -04:00
parent 2bb4d70903
commit 91c082b2d0
1 changed files with 24 additions and 9 deletions

View File

@ -37,6 +37,8 @@ db 8D 88 88 88booo. 88. db 8D
body { body {
background: black; background: black;
font-size: 100%; font-size: 100%;
max-width: 100%;
overflow-x: hidden;
} }
.iframe-container { .iframe-container {
@ -187,9 +189,10 @@ db 8D 88 88 88booo. 88. db 8D
width: auto; width: auto;
height: auto; height: auto;
margin-top: 70px; margin-top: 70px;
left: 0px; left: -100px;
z-index: 2; z-index: 2;
overflow: hidden; overflow: hidden;
transition: 0.3s;
} }
/* Style for the right menu options */ /* Style for the right menu options */
@ -197,18 +200,28 @@ db 8D 88 88 88booo. 88. db 8D
display: grid; display: grid;
grid-gap: 3px; grid-gap: 3px;
position: absolute; position: absolute;
width: auto; width: 30px;
height: auto; height: auto;
margin-top: 70px; margin-top: 70px;
right: 0px; right: 0px;
z-index: 2; z-index: 2;
overflow: hidden; transition: 0.3s;
}
#myMenu:hover {
width: 140px;
left: 0px;
}
#myMenuR:hover {
width: 140px;
right: 0px;
} }
#mySidenav a { #mySidenav a {
position: relative; position: relative;
float: inline-start; float: inline-start;
left: -120px; left: -20px;
transition: 0.3s; transition: 0.3s;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
@ -234,7 +247,7 @@ db 8D 88 88 88booo. 88. db 8D
#mySidenavR a { #mySidenavR a {
position: relative; position: relative;
float: inline-start; float: inline-start;
right: -120px; right: -20px;
transition: 0.3s; transition: 0.3s;
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
@ -255,6 +268,7 @@ db 8D 88 88 88booo. 88. db 8D
#mySidenavR a:hover { #mySidenavR a:hover {
right: 0; right: 0;
width: 130px;
} }
</style> </style>
</head> </head>
@ -384,7 +398,8 @@ db 8D Y8b d8 88 `88. .88. 88 88 db 8D
document.getElementById("FullScreen").style.display = "block"; document.getElementById("FullScreen").style.display = "block";
document.getElementById("iFrameContainer").style.zIndex = 1; document.getElementById("iFrameContainer").style.zIndex = 1;
document.getElementById("FullScreen").src = aURL[num][2]; document.getElementById("FullScreen").src = aURL[num][2];
document.getElementById("FullScreen").style.transform = "scale(" + aURL[num][3] + ")"; document.getElementById("FullScreen").style.transform =
"scale(" + aURL[num][3] + ")";
if (aURL[num][1].toLowerCase() == "back") { if (aURL[num][1].toLowerCase() == "back") {
// Start refreshes // Start refreshes