SitePoint Sponsor |
|
User Tag List
Results 1 to 4 of 4
Thread: show/hide div in frames
-
Mar 23, 2004, 12:59 #1
- Join Date
- Nov 2002
- Posts
- 218
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
show/hide div in frames
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: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>
-berzerko
by removing focus, it works in Mozilla. But still not in IECode:function getObj(objid) { parent.frames['there'].document.getElementById(objid).style.zindex = 5; parent.frames['there'].document.getElementById(objid).focus();
Last edited by berzerko; Mar 23, 2004 at 14:49.
-
Mar 23, 2004, 18:09 #2
- Join Date
- Dec 2002
- Location
- Alabama, USA
- Posts
- 2,560
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
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?Cross-Browser.com, Home of the X Library
-
Mar 23, 2004, 18:26 #3
- Join Date
- Nov 2002
- Posts
- 218
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Originally Posted by MikeFoster
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
-
Mar 24, 2004, 17:14 #4
- Join Date
- Nov 2002
- Posts
- 218
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Got it to work -almost!!
The main problem was :Code: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); }
Does anybody have a way to hide all divisions except the current one?
-b
Bookmarks