reorganise nav

This commit is contained in:
2023-05-20 07:22:17 +02:00
parent 8e1d803d8d
commit c8f9a5b9ab

View File

@@ -13,10 +13,10 @@
<img class="logo" src="https://static.janishutz.com/Logo.png" alt="logo"> <img class="logo" src="https://static.janishutz.com/Logo.png" alt="logo">
<div class="nav-list"> <div class="nav-list">
<a class="navitem inactive" id="home" href="/">Home</a> <a class="navitem inactive" id="home" href="/">Home</a>
<a class="navitem inactive" id="order" href="/order">Order</a>
<a class="navitem inactive" id="info" href="/info">Details</a> <a class="navitem inactive" id="info" href="/info">Details</a>
<a class="navitem inactive" id="contact" href="/contact">Contact</a>
<a class="navitem inactive" id="examples" href="/examples">Examples</a> <a class="navitem inactive" id="examples" href="/examples">Examples</a>
<a class="navitem inactive" id="contact" href="/contact">Contact</a>
<a class="navitem inactive" id="order" href="/order">Order</a>
</div> </div>
</div> </div>
</div> </div>
@@ -28,7 +28,7 @@
<script> <script>
let offset = 0; let offset = 0;
let menuOpen = false; let menuOpen = false;
const offsetList = { 'home': 0, 'order': -200, 'info': -400, 'contact': -600, 'examples': -800 }; const offsetList = { 'home': 0, 'info': -200, 'examples': -400, 'contact': -600, 'order': -800 };
$( document ).ready( function () { $( document ).ready( function () {
if ( sessionStorage.getItem( 'menuOpen' ) == 'true' ) { if ( sessionStorage.getItem( 'menuOpen' ) == 'true' ) {
$( '#nav-menu' ).hide( 700 ); $( '#nav-menu' ).hide( 700 );
@@ -54,13 +54,13 @@
let obj = $( this ).attr( 'id' ); let obj = $( this ).attr( 'id' );
if ( obj === 'home' ) { if ( obj === 'home' ) {
$( '#nav-menu' ).css( 'background-position', `${0 + offset}px` ); $( '#nav-menu' ).css( 'background-position', `${0 + offset}px` );
} else if ( obj == 'order' ) {
$( '#nav-menu' ).css( 'background-position', `${200 + offset}px` );
} else if ( obj == 'info' ) { } else if ( obj == 'info' ) {
$( '#nav-menu' ).css( 'background-position', `${200 + offset}px` );
} else if ( obj == 'examples' ) {
$( '#nav-menu' ).css( 'background-position', `${400 + offset}px` ); $( '#nav-menu' ).css( 'background-position', `${400 + offset}px` );
} else if ( obj == 'contact' ) { } else if ( obj == 'contact' ) {
$( '#nav-menu' ).css( 'background-position', `${600 + offset}px` ); $( '#nav-menu' ).css( 'background-position', `${600 + offset}px` );
} else if ( obj == 'examples' ) { } else if ( obj == 'order' ) {
$( '#nav-menu' ).css( 'background-position', `${800 + offset}px` ); $( '#nav-menu' ).css( 'background-position', `${800 + offset}px` );
} }
} ) } )