Tristen-comprehensive project-OLD

Developer
Digital Accessibility
Size
4,558 Kb
Views
16,192
  1. Tristen-comprehensive project-OLD Previews
  2. Tristen-comprehensive project-OLD HTML Codes
  3. Tristen-comprehensive project-OLD CSS Codes
  4. Tristen-comprehensive project-OLD JS Codes

How do I make an tristen-comprehensive project-old?

What is a tristen-comprehensive project-old? How do you make a tristen-comprehensive project-old? This script and codes were developed by Digital Accessibility on 04 December 2022, Sunday.

Tristen-comprehensive project-OLD Previews
IQ Test

Tristen-comprehensive project-OLD - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Tristen-comprehensive project-OLD</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<!--[if lt IE 9]>
<script src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="styles.css" rel="stylesheet" type="text/css"/>
<script src="tabs.js"></script>
<title>
Comprehensive Project
</title>
</head>
<body>
<header>
<h1>Tristen E. Breitenfeldt</h1>
</header> <nav aria-label="tab bar">
<ul class="topnav" id="myTopnav"> <li><a href="index.html" tabindex="0" role="link" accesskey="i" aria-selected="false">
Main
</a></li> <li><a href="autobiography.html" tabindex="0" role="link" accesskey="a" aria-selected="false">
Autobiography
</a></li> <li><a href="guidingprinciples.html" tabindex="0" role="link" accesskey="g" aria-selected="false">
My Guiding Principles
</a></li> <li><a href="learningoutcomes.html" tabindex="0" role="link" accesskey="l" aria-selected="false">
Learning Outcomes
</a></li> <li class="tab" id="tab5" aria-selected="true">
Comprehensive Project
</a></li> <li class="tab" id="tab6"><a href="resume.html" tabindex="0" role="link" accesskey="r" aria-selected="false">
Resume
</a></li> <li class="tab" id="tab7"><a href="worksamples.html" tabindex="0" role="link" accesskey="w" aria-selected="false">
Work Samples
</a></li> <li class="icon"> <a href="javascript:void(0);" onclick="myFunction()">&#9776;</a> </li>
</ul>
</nav> <!-- old
<nav aria-label="tab bar">
<div id="tabs">
<ul id="tabs" > <li class="tab" id="tab1"><a href="index.html" tabindex="0" role="link" accesskey="i" aria-selected="false">
Main
</a></li> <li class="tab" id="tab2"><a href="autobiography.html" tabindex="0" role="link" accesskey="a" aria-selected="false">
Autobiography
</a></li> <li class="tab" id="tab3"><a href="guidingprinciples.html" tabindex="0" role="link" accesskey="g" aria-selected="false">
My Guiding Principles
</a></li> <li class="tab" id="tab4"><a href="learningoutcomes.html" tabindex="0" role="link" accesskey="l" aria-selected="false">
Learning Outcomes
</a></li> <li class="tab" id="tab5" aria-selected="true">
Comprehensive Project
</a></li> <li class="tab" id="tab6"><a href="resume.html" tabindex="0" role="link" accesskey="r" aria-selected="false">
Resume
</a></li> <li class="tab" id="tab7"><a href="worksamples.html" tabindex="0" role="link" accesskey="w" aria-selected="false">
Work Samples
</a></li>
</ul>
</div>
</nav>
-->
</header>
<main>
<h2>My Comprehensive Project</h2> <h3>Universal Design for eLearning</h3> <ul><li><a href="https://docs.google.com/presentation/d/1zK2Zz3uFjhGzqrwg72ZCTMHjhnue6AqjMOpvzrPFQuk/edit?usp=sharing" target="_blank">Google Slide Show Presentation</a></li> <li><a href="https://docs.google.com/document/d/13C3pANrefmyvnqOUpz1ohfI2VsedZkkdAek0Ig6_JiY/pub?embedded=true">Google Document</a></li></ul>
<iframe src="https://docs.google.com/document/d/13C3pANrefmyvnqOUpz1ohfI2VsedZkkdAek0Ig6_JiY/pub?embedded=true" title="Theory2PracticePaper" width="100%" height="400px"></iframe>
</main>
<nav aria-label="tab bar">
<div id="tabs">
<ul id="tabs" > <li class="tab" id="tab1"><a href="index.html" tabindex="0" role="link" accesskey="i" aria-selected="false">
Main
</a></li> <li class="tab" id="tab2"><a href="autobiography.html" tabindex="0" role="link" accesskey="a" aria-selected="false">
Autobiography
</a></li> <li class="tab" id="tab3"><a href="guidingprinciples.html" tabindex="0" role="link" accesskey="g" aria-selected="false">
My Guiding Principles
</a></li> <li class="tab" id="tab4"><a href="learningoutcomes.html" tabindex="0" role="link" accesskey="l" aria-selected="false">
Learning Outcomes
</a></li> <li class="tab" id="tab5" aria-selected="true">
Comprehensive Project
</a></li> <li class="tab" id="tab6"><a href="resume.html" tabindex="0" role="link" accesskey="r" aria-selected="false">
Resume
</a></li> <li class="tab" id="tab7"><a href="worksamples.html" tabindex="0" role="link" accesskey="w" aria-selected="false">
Work Samples
</a></li>
</ul>
</div>
</nav>
</body>
</html> <script src="js/index.js"></script>
</body>
</html>

Tristen-comprehensive project-OLD - Script Codes CSS Codes

body {
max-width: 2000px; /* It's always a good idea to set a maximum value for where your design will break, in case someone is looking on a really large display, like a projector.
background-image: url('http://www.tristenb.com/background-blue.jpg');
background-size:cover;
background-repeat: no-repeat;
background-attachment: fixed;*/
background-color: #FFFFDC; color: #000000;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 350;
font-size: 1.2em;
}
/*
nav {
text-align: center;
background-color: #EBDCB5;
color: #000000;
border-radius: 20px;
border: 1px solid #C8BB9A;
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
display: block;
margin: .4em;
overflow: hidden;
width: 90%;
list-style:none;
padding:0em 2.5em 0em 0em;
font-weight: 600;
}
nav li {
display: inline;
list-style-type: none;
}
nav a {
color: #000000; display:inline-block;
line-height: 2em; padding: .5em; border: 1px solid #C8BB9A; text-decoration: none;
margin: .2em; width: 10%;
}
nav li:hover { }
nav a:hover {
color: #FFFFFF;
}
id=”credentials”:
#credentials {
text-align: center;
}
id="nav2":
#nav2 {
text-align: center;
list-style:none;
}
#nav2 li {
margin: 0;
padding: 0;
list-style-type: none;
}
#nav2 a { font-weight: bold;
color: black;
}
*/
.bgimage { background-image: url('http://www.tristenb.com/background-blue.jpg');
background-size:cover;
background-repeat: no-repeat;
background-attachment: fixed;
}
main {
width: 960px;
margin: 0 auto;
}
h1 {color: #96281B;
text-align: center;
background-color: #EBDCB5;
border-radius: 20px;
border: 1px solid #C8BB9A;
box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
display: block;
margin: .4em;
overflow: hidden;
width: 90%;
list-style:none;
padding:.5em 0em .5em 0em;	font-weight: 600;
}
/*
h1, h2, h3, h4, h5, h6 {
text-align: center;
}
h4, h5, h6 {
text-align: left;
}
*/
a:link {
color: ##551700​00ff00;
}
a:visited { color: #96281b; /*dark slate gray*/
}
a:hover { text-decoration: none; color: white; background-color: navy;
}
a:active { color: #FF00FF; /*Fuchsia*/ background-color: #007A7C;
}
th {
vertical-align: top;
}
ul.topnav li a:focus { background-color: #ffffff; color: #000000; font-weight: 4000; border: 1px grey solid;
}
/* The following CSS comes from https://www.w3schools.com/howto/howto_js_topnav.asp */
/* Remove margins and padding from the list, and add a black background color */
ul.topnav { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333;
}
/* Float the list items side by side */
ul.topnav li {float: left;}
/* Style the links inside the list items */
ul.topnav li a { display: inline-block; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none; transition: 0.3s; font-size: 17px;
}
/* Change background color of links on hover */
ul.topnav li a:hover {background-color: #555;}
/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav li.icon {display: none;}
/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon) */
@media screen and (max-width:65em) { ul.topnav li:not(:first-child) {display: none;} ul.topnav li.icon { float: right; display: inline-block; }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */
@media screen and (max-width:680px) { ul.topnav.responsive {position: relative;} ul.topnav.responsive li.icon { position: absolute; right: 0; top: 0; } ul.topnav.responsive li { float: none; display: inline; } ul.topnav.responsive li a { display: block; text-align: left; }
}

Tristen-comprehensive project-OLD - Script Codes JS Codes

window.onload=function() { // get tab container var container = document.getElementById("tabContainer"); // set current tab var navitem = container.querySelector(".tabs ul li"); //store which tab we are on var ident = navitem.id.split("_")[1]; navitem.parentNode.setAttribute("data-current",ident); //set current tab with class of activetabheader navitem.setAttribute("class","tabActiveHeader"); //hide two tab contents we don't need var pages = container.querySelectorAll(".tabpage"); for (var i = 1; i < pages.length; i++) { pages[i].style.display="none"; } //this adds click event to tabs var tabs = container.querySelectorAll(".tabs ul li"); for (var i = 0; i < tabs.length; i++) { tabs[i].onclick=displayPage; }
}
// on click of one of tabs
function displayPage() { var current = this.parentNode.getAttribute("data-current"); //remove class of activetabheader and hide old contents document.getElementById("tabHeader_" + current).removeAttribute("class"); document.getElementById("tabpage_" + current).style.display="none";
var ident = this.id.split("_")[1]; //add class of activetabheader to new active tab and show contents this.setAttribute("class","tabActiveHeader"); document.getElementById("tabpage_" + ident).style.display="block"; this.parentNode.setAttribute("data-current",ident);
} //Show and hide divs
function HideContent(d) {
document.getElementById(d).style.display = "none";
}
function ShowContent(d) {
document.getElementById(d).style.display = "block";
}
function ReverseDisplay(d) {
if(document.getElementById(d).style.display="none") { document.getElementById(d).style.display = "block"; }
else { document.getElementById(d).style.display = "none"; }
} //Came from https://www.w3schools.com/howto/howto_js_topnav.asp
/* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
function myFunction() { var x = document.getElementById("myTopnav"); if (x.className === "topnav") { x.className += " responsive"; } else { x.className = "topnav"; }
}
Tristen-comprehensive project-OLD - Script Codes
Tristen-comprehensive project-OLD - Script Codes
Home Page Home
Developer Digital Accessibility
Username digitalaccessibility
Uploaded December 04, 2022
Rating 3
Size 4,558 Kb
Views 16,192
Do you need developer help for Tristen-comprehensive project-OLD?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Digital Accessibility (digitalaccessibility) Script Codes
Name
TEB Updated-OLD3
Tristen-Main
Tristen-Resume
Tristen-Autobiography
TEB Updated-OLD2
ADA widget
TEB Updated-OLD1
Create amazing art & images with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!