http://migdaliavaldes.com/imgs/banner.jpg


/*****************************************************
 * ypSlideOutMenu
 * http://ypslideoutmenus.sourceforge.net/
 * 3/04/2001
 * 
 * a nice little script to create exclusive, slide-out
 * menus for ns4, ns6, mozilla, opera, ie4, ie5 on 
 * mac and win32. I've got no linux or unix to test on but 
 * it should(?) work... 
 *
 * Licensed under AFL 2.0
 * http://www.opensource.org/licenses/afl-2.0.php
 *
 * Revised: 
 * - 08/29/2002 : added .hideAll()
 * - 04/15/2004 : added .writeCSS() to support more 
 *                than 30 menus.
 *
 * --youngpup--
 *****************************************************/

ypSlideOutMenu.Registry = []
ypSlideOutMenu.aniLen = 250
ypSlideOutMenu.hideDelay = 1000
ypSlideOutMenu.minCPUResolution = 10

// constructor
function ypSlideOutMenu(id, dir, left, top, width, height)
{
	this.ie  = document.all ? 1 : 0
	this.ns4 = document.layers ? 1 : 0
	this.dom = document.getElementById ? 1 : 0
	this.css = "";

	if (this.ie || this.ns4 || this.dom) {
		this.id			 = id
		this.dir		 = dir
		this.orientation = dir == "left" || dir == "right" ? "h" : "v"
		this.dirType	 = dir == "right" || dir == "down" ? "-" : "+"
		this.dim		 = this.orientation == "h" ? width : height
		this.hideTimer	 = false
		this.aniTimer	 = false
		this.open		 = false
		this.over		 = false
		this.startTime	 = 0

		// global reference to this object
		this.gRef = "ypSlideOutMenu_"+id
		eval(this.gRef+"=this")

		// add this menu object to an internal list of all menus
		ypSlideOutMenu.Registry[id] = this

		var d = document

		var strCSS = "";
		strCSS += '#' + this.id + 'Container { visibility:hidden; '
		strCSS += 'left:' + left + 'px; '
		strCSS += 'top:' + top + 'px; '
		strCSS += 'overflow:hidden; z-index:10000; }'
		strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
		strCSS += 'width:' + width + 'px; '
		strCSS += 'height:' + height + 'px; '
		strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
		strCSS += '}'

		this.css = strCSS;

		this.load()
	}
}

ypSlideOutMenu.writeCSS = function() {
	document.writeln('<style type="text/css">');

	for (var id in ypSlideOutMenu.Registry) {
		document.writeln(ypSlideOutMenu.Registry[id].css);
	}

	document.writeln('</style>');
}

ypSlideOutMenu.prototype.load = function() {
	var d = document
	var lyrId1 = this.id + "Container"
	var lyrId2 = this.id + "Content"
	var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
	if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
	var temp

	if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100)
	else {
		this.container	= obj1
		this.menu		= obj2
		this.style		= this.ns4 ? this.menu : this.menu.style
		this.homePos	= eval("0" + this.dirType + this.dim)
		this.outPos		= 0
		this.accelConst	= (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen 

		// set event handlers.
		if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
		this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')")
		this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')")

		//set initial state
		this.endSlide()
	}
}
	
ypSlideOutMenu.showMenu = function(id)
{
	var reg = ypSlideOutMenu.Registry
	var obj = ypSlideOutMenu.Registry[id]
	
	if (obj.container) {
		obj.over = true

		// close other menus.
		for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu)

		// if this menu is scheduled to close, cancel it.
		if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) }

		// if this menu is closed, open it.
		if (!obj.open && !obj.aniTimer) reg[id].startSlide(true)
	}
}

ypSlideOutMenu.hideMenu = function(id)
{
	// schedules the menu to close after <hideDelay> ms, which
	// gives the user time to cancel the action if they accidentally moused out
	var obj = ypSlideOutMenu.Registry[id]
	if (obj.container) {
		if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
		obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay);
	}
}

ypSlideOutMenu.hideAll = function()
{
	var reg = ypSlideOutMenu.Registry
	for (menu in reg) {
		ypSlideOutMenu.hide(menu);
		if (menu.hideTimer) window.clearTimeout(menu.hideTimer);
	}
}

ypSlideOutMenu.hide = function(id)
{
	var obj = ypSlideOutMenu.Registry[id]
	obj.over = false

	if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
	
	// flag that this scheduled event has occured.
	obj.hideTimer = 0

	// if this menu is open, close it.
	if (obj.open && !obj.aniTimer) obj.startSlide(false)
}

ypSlideOutMenu.prototype.startSlide = function(open) {
	this[open ? "onactivate" : "ondeactivate"]()
	this.open = open
	if (open) this.setVisibility(true)
	this.startTime = (new Date()).getTime()	
	this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution)
}

ypSlideOutMenu.prototype.slide = function() {
	var elapsed = (new Date()).getTime() - this.startTime
	if (elapsed > ypSlideOutMenu.aniLen) this.endSlide()
	else {
		var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst)
		if (this.open && this.dirType == "-")		d = -d
		else if (this.open && this.dirType == "+")	d = -d
		else if (!this.open && this.dirType == "-")	d = -this.dim + d
		else										d = this.dim + d

		this.moveTo(d)
	}
}

ypSlideOutMenu.prototype.endSlide = function() {
	this.aniTimer = window.clearTimeout(this.aniTimer)
	this.moveTo(this.open ? this.outPos : this.homePos)
	if (!this.open) this.setVisibility(false)
	if ((this.open && !this.over) || (!this.open && this.over)) {
		this.startSlide(this.over)
	}
}

ypSlideOutMenu.prototype.setVisibility = function(bShow) { 
	var s = this.ns4 ? this.container : this.container.style
	s.visibility = bShow ? "visible" : "hidden"
}
ypSlideOutMenu.prototype.moveTo = function(p) { 
	this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px"
}
ypSlideOutMenu.prototype.getPos = function(c) {
	return parseInt(this.style[c])
}

// events
ypSlideOutMenu.prototype.onactivate		= function() { }
ypSlideOutMenu.prototype.ondeactivate	= function() { }






// the number you pass to initLeft doesn't matter since it will get
// changed onactivate
// function ypSlideOutMenu(id, dir, left, top, width, height)
var myMenu1 = new ypSlideOutMenu("menu1", "down", 855, 25, 40, 50)


function writeTopMenu(){

// 1. href = name of page to open
// 2. put the word(s) you want to appear just before the </a>
//
document.write('&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;' +
			   '<a class="top" href="Intro.html" target="_parent">Home</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top" href="everyyear.html" target="_parent">Every Year</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top" href="#" onmouseover="ypSlideOutMenu.showMenu(\'menu1\');"' +
			   'onmouseout="ypSlideOutMenu.hideMenu(\'menu1\')">Every Month</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top" href="baddays.html" target="_parent">Bad Days Made Beautiful</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top" href="myeveryday.html" target="_parent">Journals</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top" href="TheTenthYear.html" target="_parent">The Tenth Year</a>' +
			   '&nbsp;&nbsp;&middot;&nbsp;&nbsp;' +
			   '<a class="top"  href="ResumeandLinks.html" target="_parent">Resume and Links</a>'
			   );
document.write('<div id="menu1Container"><div id="menu1Content" class="menu"><table width="40px">' +
			'<tr><td><a class="menuItem" href="Everymonth_2004.html">2004</a></td>' +   
			'<td><a class="menuItem" href="Everymonth_2005.html">2005</a></td>' +
			'<td><a class="menuItem" href="Everymonth_2006.html">2006</a></td>' +
			'<td><a class="menuItem" href="Everymonth_2007.html">2007</a></td>' +
			'<td><a class="menuItem" href="Everymonth_2008.html">2008</a></td></tr>' +
			'</table></div></div>'
               );
}


function writeChapters(){
document.write('<br><ul class="leftlist"><!--<li class="smenu"><a href="everyyear.html" class="sublink">&nbsp;Every Year From The Everyday</a>//--><li class="smenu"><a href="dance.html" class="sublink">&nbsp;In Motion</a><li class="smenu"><a href="intimate.html" class="sublink">&nbsp;Faces and Intimate Moments</a><li class="smenu"><a href="africa.html" class="sublink">&nbsp;Traveling</a><li class="smenu"><a href="landscape.html" class="sublink">&nbsp;Landscapes</a><li class="smenu"><a href="wandering.html" class="sublink">&nbsp;As I Walk Along...</a><li class="smenu"><a href="baddays.html" class="sublink">&nbsp;Bad Days Made Beautiful</a><!--<li class="smenu"><a href="faces.html" class="sublink">&nbsp;Faces and Features</a>//--><!--<li class="smenu"><a href="night.html" class="sublink">&nbsp;Night Lights</a>//--><!--<li class="smenu"><a href="word.html" class="sublink">&nbsp;Word On The Street</a>//--><li class="smenu"><!--SPACER TO PUT BOTTOM LINE//--><br /><br /></ul>');
}

function writeNewChapters(){
document.write('<br><ul class="leftlist"><li class="smenu"><a class="sublink" href="#" >Portfolios</a><ul><li class="smenu"><a class="sublink" href="everyyear.html" target="_parent">Every Year From the Everyday</a><li class="smenu"><a class="sublink" href="intothenight_index.html" target="_parent">Into The Night</a><li class="smenu"><a class="sublink" href="inthelight_index.html" target="_parent">In The Light</a><li class="smenu"><a class="sublink" href="baddays.html" target="_parent">Bad Days Made Beautiful</a></ul></ul>');
}

function writeAboutMe(){
document.write('<ul class="leftlist"><br><li class="smenu"><a href="thinking.html" class="sublink">&nbsp;Thinking</a><li class="smenu"><a href="working.html" class="sublink">&nbsp;Experience</a><li class="smenu"><a href="showing.html" class="sublink">&nbsp;Showing</a><!--<li class="smenu"><a href="myeveryday.html" class="sublink">&nbsp;My Everyday Journals</a>//--><li class="smenu"><a href="printing.html" class="sublink">&nbsp;Printing</a><li class="smenu"><a href="chapters.html" class="sublink">&nbsp;Portfolios</a><li class="smenu"><a href="links.html" class="sublink">&nbsp;Links</a><li class="smenu"><!--SPACER TO PUT BOTTOM LINE//--><br /><br /></ul>');
}


function ShowPic (whichpic, whichtit) {
// update big picture with the right picture.
// update its title with the right title
document.showcaseimg.src = whichpic;
document.showcaseimg.alt = whichtit;
// showcasetit is the title to display
var showcasetit = whichtit;
// point to the right paragraph
var para = document.getElementById("thistit");
// get rid of old text
for (i=0;i<para.childNodes.length;i++){
para.removeChild(para.childNodes[i]);
}
// set the style for the new paragraph
para.style.fontFamily = "Geneva, Verdana,  Arial, Helvetica, sans-serif";
para.style.fontSize = 13;
para.style.fontWeight="normal";
para.style.textAlign = "center";
para.style.fontColor="#708090";

// put the text in a node
var newText = document.createTextNode(showcasetit);
// put the node in the right paragraph
para.appendChild(newText);
}


function writePrivacy(){
document.write('<div class="privacy">The images and content on this website are copyrighted properties of Migdalia Valdes. Any images or any part of this website  may not be used for commercial purposes, reproduced, copied or altered in any way, by use of computer or other electronic means, without specific permission and consent in any evidenciary form from the owner. All images are protected under United States and international copyrights law. Any unauthorized use is a violation of copyright laws.</div>');
}

function mover(id) {
document.getElementById(id).style.display='block';
}

function mout(id) {
document.getElementById(id).style.display='none';
}



function pop() {
  popupWin = window.open('pop.html', 'remote',  'menubar=0,toolbar=0,location=0,directories=0,status=0,scrollbars=0,resizable=0,dependent=0,width=970,height=470,left=0,top=0');
}


function pop() {
popupWin = window.open('pop.html', 'remote',  'menubar=0,toolbar=0,location=0,directories=0,status=0,scrollbars=0,resizable=0,dependent=0,width=970,height=470,left=0,top=0');
}