create previous next button for iframe pages
Posted
by
Resu
on Stack Overflow
See other posts from Stack Overflow
or by Resu
Published on 2012-10-16T22:57:51Z
Indexed on
2012/10/16
23:00 UTC
Read the original article
Hit count: 165
iframe
This topic may have lots of code out there, BUT I seem to be looking for a variation that isn't based on history, is it possible...
So I have this code...
<script type="text/javascript">
var pages=new Array();
pages[0]="listItem1.html";
pages[1]="listItem2.html";
pages[2]="listItem3.html";
pages[3]="listItem4.html";
pages[4]="listItem5.html";
var i=0;
var end=pages.length;
end--;
function changeSrc(operation) {
if (operation=="next") {
if (i==end) {
document.getElementById('the_iframe').src=pages[end];
i=0;}
else {
document.getElementById('the_iframe').src=pages[i];
i++;}}
if (operation=="back") {
if (i==0) {
document.getElementById('the_iframe').src=pages[0];
i=end;}
else {
document.getElementById('the_iframe').src=pages[i];
i--;}}}
</script>
</head>
<body>
<ul id="menu" role="group">
<li><a href="listItem1.html" target="ifrm" role="treeitem">Welcome</a>
<ul>
<li><a href="listItem2.html" target="ifrm" role="treeitem">Ease of Access Center</a></li>
</ul>
</li>
<li><a href="listItem3.html" target="ifrm">Getting Started</a>
<ul>
<li><a href="listItem4.html" target="ifrm">Considerations</a></li>
<li><a href="listItem5.html" target="ifrm">Changing Perspective</a></li>
</ul>
</li>
</ul>
<iframe id="the_iframe" scrolling="no" src="listItem1.htm" name="ifrm" style="width:540px;></iframe>
<input type="button" onClick="changeSrc('back');" value="Back" />
<input type="button" onClick="changeSrc('next');" value="Next" />
and if I click on the next or prev button, it does move somewhere,but...
let's say my iframe is showing listItem2, then I click on listItem4 in the menu (there is a tree menu involved), then I want to go to listItem3 and I hit the back button...instead of going to listItem3, it goes to listItem2 (or someplace that is not back a page from 4 to 3).
It appears that the buttons are navigating based on history?...but I just want a straight forward or backward movement...I don't want my buttons to have this browser-type functionality...If I'm on listItem4 and hit the next button, I want it to go to listItem5.
Many Thanks For Any Help!
© Stack Overflow or respective owner