请高手把这两个js合起来，小弟不胜感谢！！

小弟是写pb的，js不熟，清高手把这两个js合起来,A js是作为1级目录 B js 作为2级目录。就是点A 的时候，出2级目录时是B的效果。小弟不胜感激!
A js<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>ºǫ́רÓÃÊ÷ÐͲ˵¥£¬¿ÉË¢ÐÂ-www.codefans.net </title>
<style type="text/css">
<!--
*{margin:0;padding:0;border:0;}
body {
 font-size:12px;
}
#nav {
 width:300px;
 line-height: 18px;
 list-style-type: none;
 text-align:left;
}
#nav a {
 width: 300px;
 display: block;
 padding-left:20px;
 }
#nav li {
 background:#blue;  float:left;
 BORDER-RIGHT: #8c8c99 1px solid;
 BORDER-TOP: #dbfe88 1px solid;
 FONT-WEIGHT: bold;
 FONT-SIZE: 11px;
 PADDING-BOTTOM: 2px;
 BORDER-LEFT: #dbfe88 1px solid;
 CURSOR: hand;
 COLOR: black;
 PADDING-TOP: 4px;
 BORDER-BOTTOM: #8c8c88 1px solid;
background: #BBDE63 url('/images/default/star.gif') no-repeat left center;
 }
#nav li a:hover{
 url('/images/default/star.gif') no-repeat left center; }
#nav a:link  {
 color:#666; text-decoration:none;
}
#nav a:visited  {
 color:#666;text-decoration:none;
}
#nav a:hover  {
 color:#FFF;text-decoration:none;font-weight:bold;
}
/*====www.codefans.net=====¶þ¼¶Ä¿Â¼=========*/
#nav li ul {
 list-style:none;
 text-align:left;
}
#nav li ul li{ 
 BORDER-RIGHT: #ffffff 1px solid;
 BORDER-TOP: white 1px solid;
 FONT-SIZE: 11px;
 PADDING-BOTTOM: 2px;
 BORDER-LEFT: white 1px solid;
 CURSOR: hand;
 PADDING-TOP: 2px;
 BORDER-BOTTOM: #cccccc 1px solid;
 BACKGROUND-COLOR: #cccccc; /*¶þ¼¶Ä¿Â¼µÄ±³¾°É«*/
}
#nav li ul a{
         padding-left:20px;
         width:300px;
 /* padding-left¶þ¼¶Ä¿Â¼ÖÐÎÄ×ÖÏòÓÒÒƶ¯£¬µ«Width±ØÐëÖØÐÂÉèÖÃ=(×Ü¿í¶È-padding-left)*/
}
/*ÏÂÃæÊǶþ¼¶Ä¿Â¼µÄÁ´½ÓÑùʽ*/
#nav li ul a:link  {
 color:#444; text-decoration:none;
}
#nav li ul a:visited  {
 color:#666;text-decoration:none;
}
#nav li ul li a:hover {
 background:#d5d5d5;
 text-decoration:none;
 font-weight:normal;
}
/* www.codefans.net */
#nav li:hover ul {
 left: auto;
}
#nav li.sfhover ul {
 left: auto;
}
#content {
 clear: left;
}
#nav ul.collapsed {
 display: none;
}
-->
#PARENT{
 width:298px;
 padding-left:20px;
}
</style>
<script type=text/javascript><!--
var LastLeftID = "";
function menuFix() {
 var obj = document.getElementById("Nav").getElementsByTagName("li");
  
 for (var i=0; i<obj.length; i++) {
  obj[i].onmouseover=function() {
   this.className+=(this.className.length>0? " ": "") + "sfhover";
  }
  obj[i].onMouseDown=function() {
   this.className+=(this.className.length>0? " ": "") + "sfhover";
  }
  obj[i].onMouseUp=function() {
   this.className+=(this.className.length>0? " ": "") + "sfhover";
  }
  obj[i].onmouseout=function() {
   this.className=this.className.replace(new RegExp("( ?|^)sfhover\\b"), "");
  }
 }
}
function DoMenu(emid)
{
 var obj = document.getElementById(emid); 
 obj.className = (obj.className.toLowerCase() == "expanded"?"collapsed":"expanded");
 if((LastLeftID!="")&&(emid!=LastLeftID)) //¹Ø±ÕÉÏÒ»¸öMenu
 {
  document.getElementById(LastLeftID).className = "collapsed";
 }
 LastLeftID = emid;
}
function GetMenuID()
{
 var MenuID="";
 var _paramStr = new String(window.location.href);
 var _sharpPos = _paramStr.indexOf("#");
  
 if (_sharpPos >= 0 && _sharpPos < _paramStr.length - 1)
 {
  _paramStr = _paramStr.substring(_sharpPos + 1, _paramStr.length);
 }
 else
 {
  _paramStr = "";
 }
 
 if (_paramStr.length > 0)
 {
  var _paramArr = _paramStr.split("&");
  if (_paramArr.length>0)
  {
   var _paramKeyVal = _paramArr[0].split("=");
   if (_paramKeyVal.length>0)
   {
    MenuID = _paramKeyVal[1];
   }
  }
 }
 
 if(MenuID!="")
 {
  DoMenu(MenuID)
 }
}
GetMenuID(); //*function˳ÐòҪעÒ⣬·ñÔòÔÚFirefoxÀïGetMenuID()²»ÆðЧ¹û¡£
menuFix();
-->
</script>
</head>
<body>
<div id="PARENT">
<ul id="nav">
<li><a href="#Menu=ChildMenu1"  onclick="DoMenu('ChildMenu1')">ÎÒµÄÍøÕ¾</a>
<ul id="ChildMenu1" class="collapsed">
 <li><a href="/" target="_blank">www.codefans.net</a></li>
 <li><a href="/" target="_blank">www.codefans.net</a></li>
 <li><a href="/" target="_blank">www.codefans.net</a></li>
 </ul>
</li>
<li><a href="#Menu=ChildMenu2" onclick="DoMenu('ChildMenu2')">&nbsp;&nbsp;&nbsp;&nbsp;abc</a>
 <ul id="ChildMenu2" class="collapsed">
 <li><a href="/" target="_blank">Ö§¸¶</a></li>
 <li><a href="/">ÍøÉÏÖ§¸¶</a></li>
 <li><a href="/">µÇ¼Ç»ã¿î</a></li>
 <li><a href="/">ÀúÊ·ÕÊÎñ</a></li>
 </ul>
</li>
<li><a href="#Menu=ChildMenu3" onclick="DoMenu('ChildMenu3')">ÍøÕ¾¹ÜÀí</a>
 <ul id="ChildMenu3" class="collapsed">
 <li><a href="#">µÇ¼</a></li>
 <li><a href="/" target="_blank">¹ÜÀí</a></li>
 <li><a href="#">¹ÜÀí</a></li>
 <li><a href="#">¹ÜÀí</a></li>
 </ul>
</li>
<li><a href="#Menu=ChildMenu4" onclick="DoMenu('ChildMenu4')">ÍøÕ¾¹ÜÀí</a>
 <ul id="ChildMenu4" class="collapsed">
 <li><a href="/">µÇ¼</a></li>
 <li><a href="www.codefans.net" target="_blank">¹ÜÀí</a></li>
 <li><a href="/">¹ÜÀí</a></li>
 <li><a href="/">¹ÜÀí</a></li>
 </ul>
</li>
</ul>
</div>
</body>
</html>

解决方案 »

  1.   

    B js
    [code=JScript]
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>ÍøÒ³ÌØЧ-µ¼º½²Ëµ¥-ºÜ¿áµÄÉÏÏ»¬¶¯Ñ¡Ï²Ëµ¥</title>
    <meta http-equiv="content-Type" content="text/html;charset=gb2312">
    <!--°ÑÏÂÃæ´úÂë¼Óµ½<head>Óë</head>Ö®¼ä-->
    <style type="text/css">
    body{
    color: #333;
    font-size: 11px;
    font-family: verdana;
    }
    a{
    color: #fff;
    text-decoration: none;
    }
    a:hover{
    color: #DFE44F;
    }
    p{
    margin: 0;
    padding: 5px;
    line-height: 1.5em;
    text-align: justify;
    border: 1px solid #73A405;
    }
    #wrapper{
    width: 500px;
    margin: 0 auto;
    }
    .box{
    background: #fff;
    }
    .boxholder{
    clear: both;
    padding: 5px;
    background: #8DC70A;
    }
    .tab{
    float: left;
    height: 30px;
    width: 110px;
    margin: 0 1px 0 0;
    text-align: center;
    background-color: #8DC70A;
    }
    .tabtxt{
    margin: 0;
    color: #fff;
    font-size: 12px;
    padding: 9px 0 0 0;
    }
    </style>
    <script type="text/javascript">
    var Class = {
    create: function() {
    return function() {
    this.initialize.apply(this, arguments);
    }
    }
    }
    Object.extend = function(destination, source) {
    for (property in source) destination[property] = source[property];
    return destination;
    }
    Function.prototype.bind = function(object) {
    var __method = this;
    return function() {
    return __method.apply(object, arguments);
    }
    }
    Function.prototype.bindAsEventListener = function(object) {
    var __method = this;
    return function(event) {
    __method.call(object, event || window.event);
    }
    }
    function $() {
    if (arguments.length == 1) return get$(arguments[0]);
    var elements = [];
    $c(arguments).each(function(el){
    elements.push(get$(el));
    });
    return elements;
    function get$(el){
    if (typeof el == 'string') el = document.getElementById(el);
    return el;
    }
    }
    if (!window.Element) var Element = new Object();
    Object.extend(Element, {
    remove: function(element) {
    element = $(element);
    element.parentNode.removeChild(element);
    },
    hasClassName: function(element, className) {
    element = $(element);
    if (!element) return;
    var hasClass = false;
    element.className.split(' ').each(function(cn){
    if (cn == className) hasClass = true;
    });
    return hasClass;
    },
    addClassName: function(element, className) {
    element = $(element);
    Element.removeClassName(element, className);
    element.className += ' ' + className;
    },
    removeClassName: function(element, className) {
    element = $(element);
    if (!element) return;
    var newClassName = '';
    element.className.split(' ').each(function(cn, i){
    if (cn != className){
    if (i > 0) newClassName += ' ';
    newClassName += cn;
    }
    });
    element.className = newClassName;
    },
    cleanWhitespace: function(element) {
    element = $(element);
    $c(element.childNodes).each(function(node){
    if (node.nodeType == 3 && !/\S/.test(node.nodeValue)) Element.remove(node);
    });
    },
    find: function(element, what) {
    element = $(element)[what];
    while (element.nodeType != 1) element = element[what];
    return element;
    }
    });
    var Position = {
    cumulativeOffset: function(element) {
    var valueT = 0, valueL = 0;
    do {
    valueT += element.offsetTop  || 0;
    valueL += element.offsetLeft || 0;
    element = element.offsetParent;
    } while (element);
    return [valueL, valueT];
    }
    };
    document.getElementsByClassName = function(className) {
    var children = document.getElementsByTagName('*') || document.all;
    var elements = [];
    $c(children).each(function(child){
    if (Element.hasClassName(child, className)) elements.push(child);
    });  
    return elements;
    }
    //useful array functions
    Array.prototype.each = function(func){
    for(var i=0;ob=this[i];i++) func(ob, i);
    }
    function $c(array){
    var nArray = [];
    for (i=0;el=array[i];i++) nArray.push(el);
    return nArray;
    }
    var fx = new Object();
    //base
    fx.Base = function(){};
    fx.Base.prototype = {
    setOptions: function(options) {
    this.options = {
    duration: 500,
    onComplete: '',
    transition: fx.sinoidal
    }
    Object.extend(this.options, options || {});
    },
    go: function() {
    this.startTime = (new Date).getTime();
    this.timer = setInterval (this.step.bind(this), 13);
    },
    step: function() {
    var time  = (new Date).getTime();
    if (time >= this.options.duration+this.startTime) {
    this.now = this.to;
    clearInterval (this.timer);
    this.timer = null;
    if (this.options.onComplete) setTimeout(this.options.onComplete.bind(this), 10);
    }
    else {
    var Tpos = (time - this.startTime) / (this.options.duration);
    this.now = this.options.transition(Tpos) * (this.to-this.from) + this.from;
    }
    this.increase();
    },
    custom: function(from, to) {
    if (this.timer != null) return;
    this.from = from;
    this.to = to;
    this.go();
    },
    hide: function() {
    this.now = 0;
    this.increase();
    },
    clearTimer: function() {
    clearInterval(this.timer);
    this.timer = null;
    }
    }
    //stretchers
    fx.Layout = Class.create();
    fx.Layout.prototype = Object.extend(new fx.Base(), {
    initialize: function(el, options) {
    this.el = $(el);
    this.el.style.overflow = "hidden";
    this.el.iniWidth = this.el.offsetWidth;
    this.el.iniHeight = this.el.offsetHeight;
    this.setOptions(options);
    }
    });
    fx.Height = Class.create();
    Object.extend(Object.extend(fx.Height.prototype, fx.Layout.prototype), {
    increase: function() {
    this.el.style.height = this.now + "px";
    }, toggle: function() {
    if (this.el.offsetHeight > 0) this.custom(this.el.offsetHeight, 0);
    else this.custom(0, this.el.scrollHeight);
    }
    });
    fx.Width = Class.create();
    Object.extend(Object.extend(fx.Width.prototype, fx.Layout.prototype), {
    increase: function() {
    this.el.style.width = this.now + "px";
    },
    toggle: function(){
    if (this.el.offsetWidth > 0) this.custom(this.el.offsetWidth, 0);
    else this.custom(0, this.el.iniWidth);
    }
    });
    //fader
    fx.Opacity = Class.create();
    fx.Opacity.prototype = Object.extend(new fx.Base(), {
    initialize: function(el, options) {
    this.el = $(el);
    this.now = 1;
    this.increase();
    this.setOptions(options);
    },
    increase: function() {
    if (this.now == 1 && (/Firefox/.test(navigator.userAgent))) this.now = 0.9999;
    this.setOpacity(this.now);
    },
    setOpacity: function(opacity) {
    if (opacity == 0) this.el.style.visibility = "hidden";
    else this.el.style.visibility = "visible";
    if (window.ActiveXObject) this.el.style.filter = "alpha(opacity=" + opacity*100 + ")";
    this.el.style.opacity = opacity;
    },
    toggle: function() {
    if (this.now > 0) this.custom(1, 0);
    else this.custom(0, 1);
    }
    });
    //transitions
    fx.sinoidal = function(pos){
    return ((-Math.cos(pos*Math.PI)/2) + 0.5);
    //this transition is from script.aculo.us
    }
    fx.linear = function(pos){
    return pos;
    }
    fx.cubic = function(pos){
    return Math.pow(pos, 3);
    }
    fx.circ = function(pos){
    return Math.sqrt(pos);
    }
    //smooth scroll
      

  2.   

    fx.Scroll = Class.create();
    fx.Scroll.prototype = Object.extend(new fx.Base(), {
    initialize: function(options) {
    this.setOptions(options);
    },
    scrollTo: function(el){
    var dest = Position.cumulativeOffset($(el))[1];
    var client = window.innerHeight || document.documentElement.clientHeight;
    var full = document.documentElement.scrollHeight;
    var top = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
    if (dest+client > full) this.custom(top, dest - client + (full-dest));
    else this.custom(top, dest);
    },
    increase: function(){
    window.scrollTo(0, this.now);
    }
    });
    //text size modify, now works with pixels too.
    fx.Text = Class.create();
    fx.Text.prototype = Object.extend(new fx.Base(), {
    initialize: function(el, options) {
    this.el = $(el);
    this.setOptions(options);
    if (!this.options.unit) this.options.unit = "em";
    }, increase: function() {
    this.el.style.fontSize = this.now + this.options.unit;
    }
    });
    //composition effect: widht/height/opacity
    fx.Combo = Class.create();
    fx.Combo.prototype = {
    setOptions: function(options) {
    this.options = {
    opacity: true,
    height: true,
    width: false
    }
    Object.extend(this.options, options || {});
    },
    initialize: function(el, options) {
    this.el = $(el);
    this.setOptions(options);
    if (this.options.opacity) {
    this.el.o = new fx.Opacity(el, options);
    options.onComplete = null;
    }
    if (this.options.height) {
    this.el.h = new fx.Height(el, options);
    options.onComplete = null;
    }
    if (this.options.width) this.el.w = new fx.Width(el, options);
    },
    toggle: function() { this.checkExec('toggle'); },
    hide: function(){ this.checkExec('hide'); },
    clearTimer: function(){ this.checkExec('clearTimer'); },
    checkExec: function(func){
    if (this.el.o) this.el.o[func]();
    if (this.el.h) this.el.h[func]();
    if (this.el.w) this.el.w[func]();
    },
    //only if width+height
    resizeTo: function(hto, wto) {
    if (this.el.h && this.el.w) {
    this.el.h.custom(this.el.offsetHeight, this.el.offsetHeight + hto);
    this.el.w.custom(this.el.offsetWidth, this.el.offsetWidth + wto);
    }
    },
    customSize: function(hto, wto) {
    if (this.el.h && this.el.w) {
    this.el.h.custom(this.el.offsetHeight, hto);
    this.el.w.custom(this.el.offsetWidth, wto);
    }
    }
    }
    fx.Accordion = Class.create();
    fx.Accordion.prototype = {
    setOptions: function(options) {
    this.options = {
    delay: 100,
    opacity: false
    }
    Object.extend(this.options, options || {});
    },
    initialize: function(togglers, elements, options) {
    this.elements = elements;
    this.setOptions(options);
    var options = options || '';
    elements.each(function(el, i){
    options.onComplete = function(){
    if (el.offsetHeight > 0) el.style.height = '1%';
    }
    el.fx = new fx.Combo(el, options);
    el.fx.hide();
    });
    togglers.each(function(tog, i){
    tog.onclick = function(){
    this.showThisHideOpen(elements[i]);
    }.bind(this);
    }.bind(this));
    },
    showThisHideOpen: function(toShow){
    if (toShow.offsetHeight == 0) setTimeout(function(){this.clearAndToggle(toShow);}.bind(this), this.options.delay);
    this.elements.each(function(el, i){
    if (el.offsetHeight > 0 && el != toShow) this.clearAndToggle(el);
    }.bind(this));
    },
    clearAndToggle: function(el){
    el.fx.clearTimer();
    el.fx.toggle();
    }
    }
      

  3.   

    var Remember = new Object();
    Remember = function(){};
    Remember.prototype = {
    initialize: function(el, options){
    this.el = $(el);
    this.days = 365;
    this.options = options;
    this.effect();
    var cookie = this.readCookie();
    if (cookie) {
    this.fx.now = cookie;
    this.fx.increase();
    }
    },
    //cookie functions based on code by Peter-Paul Koch
    setCookie: function(value) {
    var date = new Date();
    date.setTime(date.getTime()+(this.days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
    documents.cookie = this.el+this.el.id+this.prefix+"="+value+expires+"; path=/";
    },
    readCookie: function() {
    var nameEQ = this.el+this.el.id+this.prefix + "=";
    var ca = documents.cookie.split(';');
    for(var i=0;c=ca[i];i++) {
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return false;
    },
    custom: function(from, to){
    if (this.fx.now != to) {
    this.setCookie(to);
    this.fx.custom(from, to);
    }
    }
    }
    fx.RememberHeight = Class.create();
    fx.RememberHeight.prototype = Object.extend(new Remember(), {
    effect: function(){
    this.fx = new fx.Height(this.el, this.options);
    this.prefix = 'height';
    },
    toggle: function(){
    if (this.el.offsetHeight == 0) this.setCookie(this.el.scrollHeight);
    else this.setCookie(0);
    this.fx.toggle();
    },
    resize: function(to){
    this.setCookie(this.el.offsetHeight+to);
    this.fx.custom(this.el.offsetHeight,this.el.offsetHeight+to);
    },
    hide: function(){
    if (!this.readCookie()) {
    this.fx.hide();
    }
    }
    });
    fx.RememberText = Class.create();
    fx.RememberText.prototype = Object.extend(new Remember(), {
    effect: function(){
    this.fx = new fx.Text(this.el, this.options);
    this.prefix = 'text';
    }
    });
    //useful for-replacement
    Array.prototype.each = function(func){
    for(var i=0;ob=this[i];i++) func(ob, i);
    }
    //Easing Equations (c) 2003 Robert Penner, all rights reserved.
    //This work is subject to the terms in http://www.robertpenner.com/easing_terms_of_use.html.
    //expo
    fx.expoIn = function(pos){
    return Math.pow(2, 10 * (pos - 1));
    }
    fx.expoOut = function(pos){
    return (-Math.pow(2, -10 * pos) + 1);
    }
    //quad
    fx.quadIn = function(pos){
    return Math.pow(pos, 2);
    }
    fx.quadOut = function(pos){
    return -(pos)*(pos-2);
    }
    //circ
    fx.circOut = function(pos){
    return Math.sqrt(1 - Math.pow(pos-1,2));
    }
    fx.circIn = function(pos){
    return -(Math.sqrt(1 - Math.pow(pos, 2)) - 1);
    }
    //back
    fx.backIn = function(pos){
    return (pos)*pos*((2.7)*pos - 1.7);
    }
    fx.backOut = function(pos){
    return ((pos-1)*(pos-1)*((2.7)*(pos-1) + 1.7) + 1);
    }
    //sine
    fx.sineOut = function(pos){
    return Math.sin(pos * (Math.PI/2));
    }
    fx.sineIn = function(pos){
    return -Math.cos(pos * (Math.PI/2)) + 1;
    }
    fx.sineInOut = function(pos){
    return -(Math.cos(Math.PI*pos) - 1)/2;
    }
    function init(){
    var stretchers = document.getElementsByClassName('box');
    var toggles = document.getElementsByClassName('tab');
    var myAccordion = new fx.Accordion(
      toggles, stretchers, {opacity: false, height: true, duration: 600}
    );
    //hash functions
    var found = false;
    toggles.each(function(h3, i){
      var div = Element.find(h3, 'nextSibling');
       if (window.location.href.indexOf(h3.title) > 0) {
        myAccordion.showThisHideOpen(div);
        found = true;
       }
      });
      if (!found) myAccordion.showThisHideOpen(stretchers[0]);
    }
    </script>
    </head>
    <body>
    <!--°ÑÏÂÃæ´úÂë¼Óµ½<body>Óë</body>Ö®¼ä-->
    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td><iframe style="display:none"></iframe></td>
      </tr>
    </table>
    <div id="wrapper">
    <div id="content">
    <h3 class="tab" title="first">
       <div class="tabtxt"><a href="#">The First Box</a></div>
    </h3>
    <div class="tab">
       <h3 class="tabtxt" title="second"><a href="#">The Second Box</a></h3>
    </div>
    <div class="tab">
       <h3 class="tabtxt" title="third"><a href="#">The Third Box</a></h3>
    </div>
    <div class="tab">
       <h3 class="tabtxt" title="fourth"><a href="#">The Fourth Box</a></h3>
    </div>
    <div class="boxholder">
      <div class="box">
        <p><strong>The First Box</strong><br />
        In ut felis id leo aliquet euismod. In augue lorem, posuere eu, tincidunt non, bibendum quis, nisl. Integer erat erat, posuere vel, convallis feugiat, accumsan ac, sem. Sed scelerisque tortor nec leo. Etiam vel massa vitae nulla elementum aliquet. Donec egestas semper tellus. Donec ultrices ante cursus lacus. Integer nec est. Suspendisse potenti. Donec fringilla. Maecenas condimentum, arcu sit amet volutpat tincidunt, mi urna sodales nunc, eget porttitor odio lectus sit amet metus. Vivamus aliquam. Etiam lectus leo, venenatis sit amet, vestibulum eu, sollicitudin vitae, metus.    In ut felis id leo aliquet euismod. In augue lorem, posuere eu, tincidunt non, bibendum quis, nisl. Integer erat erat, posuere vel, convallis feugiat, accumsan ac, sem. Sed scelerisque tortor nec leo. Etiam vel massa vitae nulla elementum aliquet. Donec egestas semper tellus. Donec ultrices ante cursus lacus. Integer nec est. Suspendisse potenti. Donec fringilla. Maecenas condimentum, arcu sit amet volutpat tincidunt, mi urna sodales nunc, eget porttitor odio lectus sit amet metus. Vivamus aliquam. Etiam lectus leo, venenatis sit amet, vestibulum eu, sollicitudin vitae, metus.</p>
      </div>
      <div class="box">
        <p><strong>The Second Box</strong><br />
        Ut molestie nunc eu turpis. Donec facilisis enim sed dui. Sed nunc. Cras eu arcu. Praesent vel augue vel dolor ultricies convallis. Nam consectetuer risus eu urna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam suscipit. Duis quis lacus sed tellus auctor blandit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin eget massa in ante vehicula pharetra. Ut massa pede, ornare id, ultrices eget, porta et, metus.</p>
      </div>
      <div class="box">
        <p><strong>The Third Box</strong><br />
        accumsan velit at dui tristique consectetuer. Quisque vitae felis ac arcu dignissim facilisis. Quisque ullamcorper. Cras molestie, elit vel blandit mattis, eros metus tempus tortor, id lobortis sem nunc eget dolor. Nullam dui. Aenean justo. Curabitur ullamcorper, libero eu faucibus ultricies, ipsum arcu interdum tellus, eget tempus augue mauris nec purus. Donec a pede nec tortor venenatis bibendum. Nunc quis erat ac augue rhoncus dictum. Nullam id augue at augue iaculis posuere. Nulla volutpat facilisis quam.</p>
      </div>
      <div class="box">
        <p><strong>The Fourth Box</strong><br />
        Morbi feugiat mauris at velit. Proin rutrum lectus. Proin pulvinar turpis tempor nibh. Cras sit amet magna sed risus tempor vestibulum. Nunc vitae nulla. Vivamus fermentum. Praesent a sem. Cras eu neque ultricies tellus tristique vehicula. Praesent dignissim consequat metus. Integer dolor. Donec pellentesque, libero eu ullamcorper suscipit, lorem augue molestie arcu, vitae sodales quam nulla vel urna. Suspendisse accumsan sem nec leo. Proin dui ante, placerat id, consectetuer et, gravida in, velit. Duis non massa. Etiam mollis. Vestibulum id est. Sed sit amet tellus. Vestibulum varius dolor vitae velit.</p>
      </div>
    </div>
    </div>
    </div><script type="text/javascript">
    Element.cleanWhitespace('content');
    init();</script></body></html>
    [/code]