<script language="JavaScript"> <!-- var paivat = new Array('sunnuntai','maanantai','tiistai','keskiviikko','torstai', 'perjantai','lauantai'); var tanaan= new Date(); var tunnit= tanaan.getHours(); var minuutit= tanaan.getMinutes(); var terve; if (tunnit<=5) terve= 'yötä'; else if (tunnit<12) terve='huomenta'; else if (tunnit<15) terve='päivää'; else if (tunnit<18) terve='iltapäivää'; else terve='iltaa'; document.writeln('Hyvää '+terve+'!<br />'); document.writeln('Tänään on '+paivat[tanaan.getDay()]+' '+tanaan.getDate()+'.'+ (tanaan.getMonth()+1)+'.'+tanaan.getFullYear()); //--> </script>
<script language="JavaScript"> <!-- function isInteger(x) { return (parseInt(x) ==x); } function muuta () { var mj= document.tf1.jono.value; var a= document.tf1.alku.value; var e= document.tf1.loppu.value; if (a=='') { a=0; } if (e=='') { e=mj.length-1; } var ilmoitus=''; if (!isInteger(a)) { ilmoitus += 'Alarajan pitää olla kokonaisluku!\n'; } if (!isInteger(e)) { ilmoitus += 'Ylärajan pitää olla kokonaisluku!\n'; } if (ilmoitus=='') { a=parseInt(a); e=parseInt(e); if ((e<0)||(a<0)||(e>=mj.length)||(a>=mj.length)) { alert('Indeksien oltava merkkijonon sisällä!'); } else if (e<a) { alert('Alkukohdan on oltava pienempi tai yhtäsuuri kuin loppukohta!'); } else { document.tf1.jaannos.value= mj.substring(a,e); } } else { alert(ilmoitus); } return; } //--> </script>
Yllä oleva saatiin aikaan skriptillä:
<script language="JavaScript"> <!-- for (prop in navigator) { document.writeln('<b>'+prop+'</b>: '+navigator[prop]+'<br />'); } //--> </script>
<!-- Menu ja hieman yleistä ympäristoä - taulukon määrittely Menuun voidaan lisätä alkioita pää ja alatasolle. Alkioiden id-tunnusta voidaan käyttää jos halutaan näyttää valikossa mikä sivu on parhaillaan oikeanpuoleisessa ruudussa. Muuten tunnuksia ei käytetä. --> <!-- menu alkaa tästä --> <div> <ul id="mnu"> <li id="vko"><a href="#">Verkon käyttö opetuksessa</a> <ul> <li id="vko1"><a href="#">Yleistä</a></li> <li id="vko2"><a href="#">Verkkon käyttötapoja</a></li> <li id="vko3"><a href="#">Verkossa vai ilman</a></li> <li id="vko4"><a href="#">Aineiston käytettävyys</a></li> <li id="vko5"><a href="#">Verkko-opetuksen tuki</a></li> <li id="vko6"><a href="#">Tietolähteitä</a></li> </ul> </li> <li id="ktied"><a href="#">Kurssitiedotus verkossa</a> <ul> <li id="ktied1"><a href="#">Kurssin kotisivu</a></li> <li id="ktied2"><a href="#">Sähköpostia opiskelijoille</a></li> <li id="ktied3"><a href="#">Muu tiedotus</a></li> </ul> </li> <li id="oppim"><a href="#">Oppimateriaalin välitys</a> <ul> <li id="oppim1"><a href="#">Opettajalta opiskelijoille</a></li> <li id="oppim2"><a href="#">Opiskelijoilta opettajalle</a></li> <li id="oppim3"><a href="#">Opiskelijoiden välillä</a></li> </ul> </li> <li id="veropi"><a href="#">Verkko-opiskelu</a> <ul> <li id="veropi1"><a href="#">Mitä on verkko-opiskelu</a></li> <li id="veropi2"><a href="#">Miksi verkko-opiskelua</a></li> <li id="veropi3"><a href="#">Edellytykset</a></li> <li id="veropi4"><a href="#">Opiskelumuodot</a></li> <li id="veropi5"><a href="#">Esimerkkejä</a></li> </ul> </li> <li id="verope"><a href="#">Verkko-opetus</a> <ul> <li id="verope1"><a href="#">Mitä on verkko-opetus</a></li> <li id="verope2"><a href="#">Opettajan roolit ja tehtävät</a></li> </ul> </li> <li id="opmu"><a href="#">Opetusmuotoja</a> <ul> <li id="opmu1"><a href="videoluento.shtml">Videoluento</a></li> <li id="opmu2"><a href="verkkomoniste.shtml">Verkkomoniste</a></li> <li id="opmu3"><a href="vvkurssi.shtml">Vuorovaikutteinen kurssi</a></li> <li id="opmu4"><a href="#">Ryhmäopiskelun ohjaaminen</a></li> <li id="opmu5"><a href="#">Itseopiskelun ohjaaminen</a></li> </ul> </li> <li id="opal"><a href="#">Oppimisalustat</a> <ul> <li id="opal1"><a href="#">Etuja ja haittoja</a></li> <li id="opal2"><a href="#">WebCT</a></li> <li id="opal3"><a href="#">BSCW</a></li> <li id="opal4"><a href="#">Muita</a></li> <li id="opal5"><a href="#">Esimerkkejä ja kokemuksia</a></li> </ul> </li> <li id="matsku"><a href="matsku.shtml">Materiaalituotanto</a> <ul> <li id="matsku1"><a href="matsku1.shtml">Esitutkimus</a></li> <li id="matsku2"><a href="matsku2.shtml">Periaatesuunnittelu</a></li> <li id="matsku3"><a href="#">Sisällön suunnittelu</a></li> <li id="matsku4"><a href="#">Toteutus</a></li> <li id="matsku5"><a href="#">Testaus</a></li> <li id="matsku6"><a href="#">Käyttöönotto</a></li> <li id="matsku7"><a href="#">Ylläpito</a></li> <li id="matuot3"><a href="#">Tekijänoikeudet</a></li> <li id="matuot4"><a href="#">Esimerkkejä</a></li> </ul> </li> <li id="kokem"><a href="#">Kokemuksia ja mielipiteitä</a></li> <li id="lahde"><a href="#">Tietolähteitä</a></li> <li id="sivusto"><a href="#">Tämän sivuston ylläpito</a> <ul> <li id="sivusto1"><a href="sivurakenne.shtml">Sivuston rakenne</a></li> <li id="sivusto2"><a href="sivulisays.shtml">Uuden sivun lisäys</a></li> </ul> </li> </ul> <div style="padding-top: 26px;" class="otsakepieni">Yhteystiedot:</div> <img src="images/viiva_192x18.gif" alt=" " width="192" height="18" border="0" /> <div style="padding-left: 5px;"> <strong>Sähköposti:</strong><br /> <a href="mailto:verkko-opetus@cs.helsinki.fi">verkko-opetus@cs.helsinki.fi</a> </div> <!-- menu loppuu tähän -->
Kullakin sivuilla on:
<body onload="start('active-page_menu_id')>
//käydään läpi menun alkiot function loopElements(el,level,active){ var mode; var down; for (var i=0;i<el.childNodes.length;i++) { // classify li nodes if (el.childNodes[i] && el.childNodes[i]["tagName"] && el.childNodes[i].tagName.toLowerCase() == "li"){ if (el.childNodes[i].id != null) { if (el.childNodes[i].id == active) { // if current is active open submenu down="block" mode="mact"+level } else { if (active.indexOf(el.childNodes[i].id,0)>= 0){ // if active is in submenu open submenu down="block" mode="mnu"+level } else { down="none" mode="mnu"+level } } } else { down="none" mode="mnu"+level } el.childNodes[i].className=mode // Check the childnodes of current li node (A and UL tags) childs = el.childNodes[i].childNodes for (var j=0;j<childs.length;j++) { temp = childs[j] if(temp && temp["tagName"]){ if (temp.tagName.toLowerCase() == "a"){ // attach the onclick handler and classify the a-nodes temp.className = mode temp.onclick = showHide el.childNodes[i].a = temp } else { if(temp.tagName.toLowerCase() == "ul"){ temp.style.display = down // visibility depends on the previous level temp.className= "mnu"+level //Recursive - calling it self with the new found element //to go all the way through the three. loopElements(temp,level +1,active) } } } } } } } function showHide(){ //Bluring the tag so we don't get the "selected square" this.blur() //We have a A tag - need to go to the LI tag to check for UL tags: el = this.parentNode //Loop for UL tags: for(var i=0;i<el.childNodes.length;i++){ temp = el.childNodes[i] if(temp && temp["tagName"] && temp.tagName.toLowerCase() == "ul"){ //Check status: if(temp.style.display=="none"){ temp.style.display = "" }else{ temp.style.display = "none" } } } //Returning true if there's a link. Else returns false so it doesn't go to "#" if(this.href!="#"){ return true }else return false } function setClasses(active){ var menu = document.getElementById("mnu") // start element if(!menu.childNodes) return // ei onnnistu menu.className="mnu"+0 //hide the menu before styling it: loopElements(menu,0,active) } /* mekintään alkiot jos voidaan */ function start(active) { if(document.getElementById && document.createElement) setClasses(active) }