Site links

Udskriv side

makePrintButton() laver en knap som kan udskrive side. Eksempel:

Funktionen køres ved eventen onload. Herefter kontrolleres om browseren understøtter window.print og om den er DOM-kompatibel.
Hvis browseren er kompatibel oprettes et input element af typen button, med teksten "Udskriv side" og funktionen window.print tilføjes eventen onclick.
Til sidst tilføjes knappen div elementet med id'et printbutton.

Fordel
Udskrift knappen bliver kun vis hvis browseren understøtter den. Ved manglende javascript vises ingen knap. Javascriptet kan adskilles fra html-dokumentet.

Javascriptet:

function makePrintButton() {
 if ((window.print) && (document.getElementById) && (document.createElement)) {
  oPB = document.getElementById('printbutton');
  if (oPB) {
   oInput = document.createElement('INPUT');
   oInput.setAttribute('type','button');
   oInput.setAttribute('value','Udskriv side');
   oInput.onclick=window.print;
   oPB.appendChild(oInput);
  }
 }
}
window.onload=makePrintButton;

HTML-koden:

<div id="printbutton"></div>

Top

Mouseover title

Eksempel på links med mouseover hvor title bliver vist:

Fordel
Ved manglende javascript vises almindelige links. Javascriptet kan adskilles fra html-dokumentet. 
function findOnMouseOverTitles(el) {
 oLinks = el.getElementsByTagName('A');
 for (var i=0;i<oLinks.length;i++) { 
  oLinks.item(i).onmouseover=showTitle;
 }
}

function showTitle() {
 oTitleinfo = document.getElementById('titleinfo');
 sTitle = document.createTextNode(this.getAttribute('title'));
 if (oTitleinfo.hasChildNodes())
  oTitleinfo.replaceChild(sTitle, oTitleinfo.firstChild);
 else
  oTitleinfo.appendChild(sTitle);
 
 this.onmouseout = hideTitle;
}

function hideTitle() {
 oTitleinfo = document.getElementById('titleinfo');
 sTitle = oTitleinfo.firstChild;
 oTitleinfo.removeChild(sTitle);
}

Top

setTitle2DefaultText

setTitle2DefaultText sætter default teksten på input element til dens title.

Fordel
Javascriptet kan adskilles fra html-dokumentet.

Ved eventen onload køres funktionen setTitle2DefaultText på det element der skal have titlen som default tekst. Input elementets værdi søttes til dens title, clearText og setTitle sætte på eventsne onfocus og onblur.

Funktionen clearText sletter værdi i input elementet og setTitle sætter title til default værdi.

Javascriptet:

function setTitle2DefaultText(el) {
 el.value   = el.title;
 el.onfocus = clearText;
 el.onblur  = setTitle;
}
function clearText() {
 if ((this.value == this.title)) {
  this.value = '';
 }
}
function setTitle() {
 if ((this.value == '')) {
  this.value = this.title;
 }
}

Eksempel på onload:

function init() {
 setTitle2DefaultText(document.getElementById('search'));
 setTitle2DefaultText(document.getElementById('password'));
 setTitle2DefaultText(document.getElementById('username'));
}

window.onload=init;

Top

AHrefPopup

Eksempel på link med classen ahrefpopup som åbner i nyt vindue.

Fordel
Browsere uden javascript og søgemaskiner kan følge linket. Javascriptet kan adskilles fra html-dokumentet.

Javascriptet:

var win_ahrefpopup;

function findAHrefPopup() {
 oA = document.getElementsByTagName('A');
 for (var i=0;i<oA.length;i++) { 
  if (oA.item(i).className=='ahrefpopup') {
   oA.item(i).setAttribute('id','ahrefpopup'+i);
   oA.item(i).onclick=ahrefpopup;
  }
 }
}

function ahrefpopup() {
 if (this.href) {
  if (!win_ahrefpopup || (win_ahrefpopup && win_ahrefpopup.closed)) {
   win_ahrefpopup=open(this.href,'','');
   win_ahrefpopup.focus();
  } else {
   win_ahrefpopup.focus();
  }
 return false;
 }
}

window.onload = findAHrefPopup;

Linket:

<a href="readme.html" class="ahrefpopup">link</a>

Top