added JS code and added logo resizing
This commit is contained in:
parent
e0393eb018
commit
0405f1f6e1
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
|
|
@ -13,10 +13,12 @@
|
|||
<link rel="apple-touch-startup-image" href="MORBLOXSplash.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="MORBLOX.ico">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="navbar">
|
||||
<a href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_full" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_small" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogoshort.png" width="40" height="40"/></a>
|
||||
<div class="navbarbuttoncontainer">
|
||||
<a class="navbarbutton" href="home.html">Home</a>
|
||||
<a class="navbarbutton" href="games.html">Games</a>
|
||||
|
|
|
|||
|
|
@ -13,10 +13,12 @@
|
|||
<link rel="apple-touch-startup-image" href="MORBLOXSplash.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="MORBLOX.ico">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="navbar">
|
||||
<a href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_full" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_small" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogoshort.png" width="40" height="40"/></a>
|
||||
<div class="navbarbuttoncontainer">
|
||||
<a class="navbarbutton" href="home.html">Home</a>
|
||||
<a class="navbarbutton" href="games.html">Games</a>
|
||||
|
|
|
|||
|
|
@ -13,10 +13,12 @@
|
|||
<link rel="apple-touch-startup-image" href="MORBLOXSplash.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="MORBLOX.ico">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="navbar">
|
||||
<a href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_full" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_small" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogoshort.png" width="40" height="40"/></a>
|
||||
<div class="navbarbuttoncontainer">
|
||||
<a class="navbarbutton" href="home.html">Home</a>
|
||||
<a class="navbarbutton" href="games.html">Games</a>
|
||||
|
|
@ -33,7 +35,7 @@
|
|||
<a class="smallnavbarbutton" href="Settings.html">Settings</a>
|
||||
</div>
|
||||
</header>
|
||||
<header class="alert" id="invisible">
|
||||
<header class="invisible" id="alert">
|
||||
<p class="alerttext" >ALERT TEXT</p>
|
||||
</header>
|
||||
<div class="content">
|
||||
|
|
@ -42,7 +44,6 @@
|
|||
</div>
|
||||
<footer>
|
||||
<p>ABOUT MORBLOX...</p>
|
||||
<p>hello world ....</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -13,10 +13,12 @@
|
|||
<link rel="apple-touch-startup-image" href="MORBLOXSplash.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="MORBLOX.ico">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="navbar">
|
||||
<a href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_full" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_small" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogoshort.png" width="40" height="40"/></a>
|
||||
<div class="navbarbuttoncontainer">
|
||||
<a class="navbarbutton" href="home.html">Home</a>
|
||||
<a class="navbarbutton" href="games.html">Games</a>
|
||||
|
|
|
|||
4
main.css
4
main.css
|
|
@ -1,4 +1,4 @@
|
|||
.alert {
|
||||
#alert {
|
||||
height: 50px;
|
||||
margin: 0px;
|
||||
padding-left: 5px;
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
text-align: left;
|
||||
background-color: black;
|
||||
}
|
||||
#invisible {
|
||||
.invisible {
|
||||
display: none !important;
|
||||
}
|
||||
html {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
window.addEventListener('resize', function() {
|
||||
var logo_full = document.getElementById("logo_full")
|
||||
var logo_small = document.getElementById("logo_small")
|
||||
var viewport_width = window.innerWidth;
|
||||
if (viewport_width < 625) {
|
||||
logo_full.className = "invisible";
|
||||
logo_small.className = "";
|
||||
} else {
|
||||
logo_small.className = "invisible";
|
||||
logo_full.className = "";
|
||||
}
|
||||
});
|
||||
|
|
@ -13,10 +13,12 @@
|
|||
<link rel="apple-touch-startup-image" href="MORBLOXSplash.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="MORBLOX.ico">
|
||||
<link rel="stylesheet" href="main.css">
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="navbar">
|
||||
<a href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_full" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogo.png" width="200" height="40"/></a>
|
||||
<a id="logo_small" href="index.html"><img alt="MORBLOX Logo" src="MORBLOXlogoshort.png" width="40" height="40"/></a>
|
||||
<div class="navbarbuttoncontainer">
|
||||
<a class="navbarbutton" href="home.html">Home</a>
|
||||
<a class="navbarbutton" href="games.html">Games</a>
|
||||
|
|
|
|||
Loading…
Reference in New Issue