Difference between revisions of "Team:Rheda Bielefeld/Probedesign"

(Created page with "<!DOCTYPE html> <html> <title>W3.CSS Template</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="...")
 
Line 1: Line 1:
−
<!DOCTYPE html>
+
 
 
<html>
 
<html>
 
<title>W3.CSS Template</title>
 
<title>W3.CSS Template</title>
Line 49: Line 49:
 
</div>
 
</div>
  
−
<!-- Sidebar -->
 
−
<nav class="w3-sidebar w3-bar-block w3-collapse w3-large w3-theme-l5 w3-animate-left" id="mySidebar">
 
−
  <a href="javascript:void(0)" onclick="w3_close()" class="w3-right w3-xlarge w3-padding-large w3-hover-black w3-hide-large" title="Close Menu">
 
−
    <i class="fa fa-remove"></i>
 
−
  </a>
 
−
  <h4 class="w3-bar-item"><b>Menu</b></h4>
 
−
  <a class="w3-bar-item w3-button w3-hover-black" href="#">Link</a>
 
−
  <a class="w3-bar-item w3-button w3-hover-black" href="#">Link</a>
 
−
  <a class="w3-bar-item w3-button w3-hover-black" href="#">Link</a>
 
−
  <a class="w3-bar-item w3-button w3-hover-black" href="#">Link</a>
 
−
</nav>
 
  
−
<!-- Overlay effect when opening sidebar on small screens -->
 
−
<div class="w3-overlay w3-hide-large" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
 
  
 
<!-- Main content: shift it to the right by 250 pixels when the sidebar is visible -->
 
<!-- Main content: shift it to the right by 250 pixels when the sidebar is visible -->
Line 128: Line 115:
 
</div>
 
</div>
  
−
<script>
 
−
// Get the Sidebar
 
−
var mySidebar = document.getElementById("mySidebar");
 
  
−
// Get the DIV with overlay effect
 
−
var overlayBg = document.getElementById("myOverlay");
 
−
 
−
// Toggle between showing and hiding the sidebar, and add overlay effect
 
−
function w3_open() {
 
−
    if (mySidebar.style.display === 'block') {
 
−
        mySidebar.style.display = 'none';
 
−
        overlayBg.style.display = "none";
 
−
    } else {
 
−
        mySidebar.style.display = 'block';
 
−
        overlayBg.style.display = "block";
 
−
    }
 
−
}
 
−
 
−
// Close the sidebar with the close button
 
−
function w3_close() {
 
−
    mySidebar.style.display = "none";
 
−
    overlayBg.style.display = "none";
 
−
}
 
−
</script>
 
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 08:58, 27 July 2018

W3.CSS Template

Logo About Values News Contact Clients Partners

Heading

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

AD

AD

Heading

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

AD

AD

Heading

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

AD

AD

1 2 3 4 5 »