Topic awaiting preservation: Hide/Show Layers with 'Next' and 'Previous' buttons???? URGENT HELP NEEDED!! (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=26530" title="Pages that link to Topic awaiting preservation: Hide/Show Layers with &#039;Next&#039; and &#039;Previous&#039; buttons???? URGENT HELP NEEDED!! (Page 1 of 1)" rel="nofollow" >Topic awaiting preservation: Hide/Show Layers with 'Next' and 'Previous' buttons???? URGENT HELP NEEDED!! <span class="small">(Page 1 of 1)</span>\$

Plasma Neurotic (0) Inmate Newly admitted From: Insane since: Aug 2005	posted 08-24-2005 22:41 I have this project that needs to be finished within 3 days and I'm desperate. I need to know how I can control 5 layers with a 'next' and a 'previous' button. I sort of know how to control them with 5 seperate buttons for each layer...but I need to control them with only those two buttons. That's it...nothing more. PLEASE HELP!
zavaboy Bipolar (III) Inmate From: f(x) Insane since: Jun 2004	posted 08-24-2005 22:43 Layers as in...? Divs?
Plasma Obsessive-Compulsive (I) Inmate From: Insane since: Aug 2005	posted 08-24-2005 22:53 yes.
Slime Lunatic (VI) Mad Scientist From: Massachusetts, USA Insane since: Mar 2000	posted 08-24-2005 23:16 Control as in make visible and invisible? Something like this... code: <!-- HTML --> <body onload="init();"> <a href="" onclick="prev(); return false;">previous</a> <a href="" onclick="next(); return false;">next</a> <div id="layer0" class="hideshowlayer">...</div> <div id="layer1" class="hideshowlayer">...</div> <div id="layer2" class="hideshowlayer">...</div> ... // CSS // (make all layers start off invisible) .hideshowlayer {display:none;} // JavaScript var curlayer = 0; var numlayers = 3; // set this appropriately var layers = new Array(); function init() { for (var i = 0; i < numlayers; ++i) { layers[i] = document.getElementById("layer" + i); } layers[curlayer].style.display = 'block'; } function prev() { layers[curlayer].style.display = 'none'; --curlayer; if (curlayer < 0) curlayer = 0; layers[curlayer].style.display = 'block'; } function next() { layers[curlayer].style.display = 'none'; ++curlayer; if (curlayer >= numlayers) curlayer = numlayers - 1; layers[curlayer].style.display = 'block'; } all of the above code is untested, but it's a start.
reisio Paranoid (IV) Inmate From: Florida Insane since: Mar 2005	posted 08-25-2005 20:37 If the data isn't too large (therefore not making the page load too great), you can just use CSS. Examples: http://reisio.com/temp/dogwood/ http://reisio.com/temp/mbzle/

Topic awaiting preservation: Hide/Show Layers with 'Next' and 'Previous' buttons???? URGENT HELP NEEDED!! (Page 1 of 1) $Pages that link to <a href="https://ozoneasylum.com/backlink?for=26530" title="Pages that link to Topic awaiting preservation: Hide/Show Layers with &#039;Next&#039; and &#039;Previous&#039; buttons???? URGENT HELP NEEDED!! (Page 1 of 1)" rel="nofollow" >Topic awaiting preservation: Hide/Show Layers with 'Next' and 'Previous' buttons???? URGENT HELP NEEDED!! <span class="small">(Page 1 of 1)</span>\$

Plasma
Neurotic (0) Inmate
Newly admitted

From:
Insane since: Aug 2005

posted 08-24-2005 22:41

I have this project that needs to be finished within 3 days and I'm desperate.

I need to know how I can control 5 layers with a 'next' and a 'previous' button. I sort of know how to control them with 5 seperate buttons for each layer...but I need to control them with only those two buttons. That's it...nothing more.

PLEASE HELP!

zavaboy
Bipolar (III) Inmate

From: f(x)
Insane since: Jun 2004

posted 08-24-2005 22:43

Layers as in...? Divs?

Plasma
Obsessive-Compulsive (I) Inmate

From:
Insane since: Aug 2005

posted 08-24-2005 22:53

yes.

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted 08-24-2005 23:16

Control as in make visible and invisible?

Something like this...

code:

<!-- HTML -->
<body onload="init();">
<a href="" onclick="prev(); return false;">previous</a>
<a href="" onclick="next(); return false;">next</a>
<div id="layer0" class="hideshowlayer">...</div>
<div id="layer1" class="hideshowlayer">...</div>
<div id="layer2" class="hideshowlayer">...</div>
...

// CSS
// (make all layers start off invisible)
.hideshowlayer {display:none;}

// JavaScript
var curlayer = 0;
var numlayers = 3; // set this appropriately
var layers = new Array();

function init()
{
    for (var i = 0; i < numlayers; ++i) {
        layers[i] = document.getElementById("layer" + i);
    }
    layers[curlayer].style.display = 'block';
}

function prev()
{
    layers[curlayer].style.display = 'none';
    --curlayer; if (curlayer < 0) curlayer = 0;
    layers[curlayer].style.display = 'block';
}
function next()
{
    layers[curlayer].style.display = 'none';
    ++curlayer; if (curlayer >= numlayers) curlayer = numlayers - 1;
    layers[curlayer].style.display = 'block';
}

all of the above code is untested, but it's a start.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

posted 08-25-2005 20:37

If the data isn't too large (therefore not making the page load too great), you can just use CSS.

Examples:
http://reisio.com/temp/dogwood/
http://reisio.com/temp/mbzle/