»
EnglishFrenchVietnamese

Print - Rollover Text - Hide and Show - JavaScriptBank.com

Full version: jsB@nk » Menu » Navigation » Rollover Text - Hide and Show
URL: https://www.javascriptbank.com/rollover-text-hide-and-show.html

Rollover Text - Hide and Show © JavaScriptBank.comUse this JavaScript to provide tooltips, F.A.Qs, and other information. The tip is shown when the mouse rolls over the title. You can use any valid HTML element, even links.

Full version: jsB@nk » Menu » Navigation » Rollover Text - Hide and Show
URL: https://www.javascriptbank.com/rollover-text-hide-and-show.html



CSS
<style type="text/css"><!--dt {  font-weight:bold;}--></style>


JavaScript
<script type="text/javascript"><!--// Created by: Fang :: http://www.webdeveloper.com/forum/showpost.php?p=820426&postcount=2function showHide(parent) {  var aDD=parent.getElementsByTagName('dd');  for(var dd=0; dd<aDD.length; dd++) {    aDD[dd].style.display=(aDD[dd].style.display=='none')? 'block' : 'none';  }}// Multiple onload function created by: Simon Willison// http://simonwillison.net/2004/May/26/addLoadEvent/function addLoadEvent(func) {  var oldonload = window.onload;  if (typeof window.onload != 'function') {    window.onload = func;  } else {    window.onload = function() {      if (oldonload) {        oldonload();      }      func();    }  }}addLoadEvent(function() {var aDT=document.getElementsByTagName('dt');for(var i=0; i<aDT.length; i++) {    aDT[i].onmouseover=aDT[i].onmouseout=Function ('showHide(this.parentNode)');    showHide(aDT[i].parentNode);    }});//--></script>


HTML
<dl>  <dt><a href="http://www.w3.org/">The World Wide Web Consortium</a></dt>    <dd style="display: none;">Develops interoperable technologies (<em>specifications</em>, <em>guidelines</em>, <em>software</em>, and <em>tools</em>) to lead the Web to its full potential.</dd></dl><dl>  <dt><a href="http://en.wikipedia.org/wiki/Unobtrusive_JavaScript">Unobtrusive JavaScript</a></dt>    <dd style="display: none;">The separation of JavaScript functionality (the "behavior layer") from a Web page's structure/content and presentation layers</dd></dl><dl>  <dt>Unrelated stuff (no link)</dt>    <dd style="display: none;">Maquande lingues coalesce, li grammatica del resultant lingue es plusimplic e regulari quam ti del coalescent lingues. Li nov lingua francava esser plu simplic e regulari quam li existent Europan lingues. It vaesser tam simplic quam Occidental.</dd></dl>