show/hide div in frames

[berzerko]

I have an Iframe that brings in text pages that are broken into chapters (individual text files) and pages(divisions in the text files). My control menu works to jump around between the chapters and pages. But what I also want to do is "hide" the previous page divsion and "show" the next page. How would I do this?

(I was trying to get it to work in the function fore_page before I applied it throughout the code.)

here is my code:

<script type="text/javascript">
function back_chapt(elem)
{
		elem.page=document.forms['chapage'].elements['pge'];
		elem.chapt=document.forms['chapage'].elements['chp'];
		elem.chapt.value=eval(elem.chapt.value)-1;
		elem.page.value=1;
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
}
function back_page(elem)
{
		elem.page=document.forms['chapage'].elements['pge'];
		elem.chapt=document.forms['chapage'].elements['chp'];
		elem.oldchapt= elem.chapt.value;
		elem.pgid='Pg'+eval(elem.page.value);
		elem.newchapt=frames['there'].document.getElementById(elem.pgid).getAttribute('valueC');
		elem.newpage=frames['there'].document.getElementById(elem.pgid).getAttribute('valueD');
		elem.chapt.value=elem.newchapt;
		elem.page.value=elem.newpage;
		
		if (elem.oldchapt != elem.newchapt)
	{
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;

	} else {
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
	}								
}

function go_to(elem)
{		
		elem.page=document.forms['chapage'].elements['pge'];
		elem.chapt=document.forms['chapage'].elements['chp'];
		elem.newpgid='Pg'+eval(elem.page.value);
		elem.pgidm='Pg'+eval(elem.page.value)-1;
		elem.pgidp='Pg'+eval(elem.page.value)+1;
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;

		
}
function fore_chapt(elem)
{
		elem.page=document.forms['chapage'].elements['pge'];
		elem.chapt=document.forms['chapage'].elements['chp'];
		elem.chapt.value=eval(elem.chapt.value)+1;
		elem.page.value=1;
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
}
function fore_page(elem)
{
		elem.page=document.forms['chapage'].elements['pge'];
		elem.chapt=document.forms['chapage'].elements['chp'];
		elem.oldchapt= elem.chapt.value;
		elem.pgid='Pg'+eval(elem.page.value);
		elem.newchapt=frames['there'].document.getElementById(elem.pgid).getAttribute('valueA');
		elem.newpage=frames['there'].document.getElementById(elem.pgid).getAttribute('valueB');
		elem.chapt.value=elem.newchapt;
		elem.page.value=elem.newpage;
		elem.newpgid='Pg'+eval(elem.newpage);
		
		if (elem.oldchapt != elem.newchapt)
	{
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
		hideObj(elem.pgid);
		showObj(elem.newpgid);
	} else {
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
		getObj(elem.newpgid);
		hideObj(elem.pgid);alert('hide');
		showObj(elem.newpgid);alert('show');
	}								
}
function getObj(objid)
{
	parent.frames['there'].document.getElementById(objid).style.zindex = 5;
parent.frames['there'].document.getElementById(objid).focus();
}
function hideObj(objid)
{
	parent.frames['there'].document.getElementById(objid).style.visibility ='hidden';
}
function showObj(objid)
{
	parent.frames['there'].document.getElementById(objid).style.visibility ='visible';
}

</script>

The alerts for hide and show work, for whatever that's worth.

-berzerko

by removing focus, it works in Mozilla. But still not in IE

function getObj(objid)
{
        parent.frames['there'].document.getElementById(objid).style.zindex = 5;
parent.frames['there'].document.getElementById(objid).focus();

Here is a link to the site,(note: only the code in chapt 1 has been revised to work, and it only works in mozilla)http://educatewithpurpose.com/Lit/Robin/GoTo3.php

[MikeFoster]

I'm not sure what you want - I don't see any DIVs, just tables. Perhaps you want to hide/show rows in the table?

I noticed you're using "visibility" instead of "display". Have a look at this page. Mouse over any black heading. It allows you to display or not display the following section. Is this similar to what you have in mind?

[berzerko]

I'm not sure what you want - I don't see any DIVs, just tables. Perhaps you want to hide/show rows in the table?

I noticed you're using "visibility" instead of "display". Have a look at this page. Mouse over any black heading. It allows you to display or not display the following section. Is this similar to what you have in mind?

The only chapter set up with div's is chapter 1. I intend to have all the div's hidden nad un hidden into the same absolute position.

For example: in chapter one div id="Pg1" is the only one not hidden, the rest are hidden, and I want to swap them back and forth as I either advance/go back a chapter or page.

Chapter one works the way I want it to in Mozilla. It seems that in IE and Safari the first page won't hide and the second..nth page won't show. I have no idea why it isn't working.


-b

[berzerko]

Got it to work -almost!!

The main problem was :

	if (elem.olchapt != elem.newchapt)
	{
		frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;

	} else {	
frames['there'].location.href=elem.chapt.value+'.html#Pg'+elem.page.value;
		hideObj(elem.olpgid);
		showObj(elem.newpgid);	
	}

Now the only problem is that if you use the manual page input and "GO" button. Then the divisions don't hide and they all pile up on each other.

Does anybody have a way to hide all divisions except the current one?

-b