PDA

Click to See Complete Forum and Search --> : Count Visible Layers

zebdaag
12-04-2003, 05:45 PM
Hi, i've got an script in wich I hide en show layers and I want to count the layers wich are visible and give it an out put in textfield 'Q'
fredmv
12-04-2003, 05:58 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>untitled</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<script type="text/javascript">
//<![CDATA[
function countVisibleContainers()
{
var d = document.getElementsByTagName('div'), j = 0;
for(i=0; i<d.length; i++) if(d[i].style.visibility=="visible") j++;
document.forms[0][0].value = j;
}

onload = countVisibleContainers;
//]]>
</script>
</head>
<body>
<form action="#">
<div>
<label for="number">
Number of visible <span style="font-family: courier;">&lt;div&gt;</span> elements:
<input type="text" id="number" readonly="readonly" />
</label>
</div>
</form>
<hr />
<div id="foo1" style="visibility: visible;">foo1</div>
<div id="foo2" style="visibility: visible;">foo2</div>
<div id="foo3" style="visibility: hidden;">foo3</div>
<div id="foo4" style="visibility: visible;">foo4</div>
<div id="foo5" style="visibility: visible;">foo5</div>
</body>
</html>
zebdaag
12-04-2003, 06:24 PM
hi,

I tried the script and it did work on it's own but not with the script I already had..>

I think the problem may be on the form name I got
fredmv
12-04-2003, 06:27 PM
Could you please post the code you're working with then? ;)
zebdaag
12-04-2003, 06:31 PM
yes I can but I have to worn you that the code I'm working on is a test and quite a mess...but Ill put it on here

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>

<!-------------------------------------------------------->
<!----------------Random Positioning---------------------->
<!-------------------------------------------------------->
<!-------------------------------------------------------->
<script type="text/javascript">
<!--
function positionLayer(){
var a = Math.round((Math.random() * 1024));
var b = Math.round((Math.random() * 768));
A1.style.left=a+'px';
A1.style.top=b+'px';
var c = Math.round((Math.random() * 1024));
var d = Math.round((Math.random() * 768));
A2.style.left=c+'px';
A2.style.top=d+'px';
var e = Math.round((Math.random() * 1024));
var f = Math.round((Math.random() * 768));
A3.style.left=e+'px';
A3.style.top=f+'px';
var g = Math.round((Math.random() * 1024));
var h = Math.round((Math.random() * 768));
A13.style.left=g+'px';
A13.style.top=h+'px';
var i = Math.round((Math.random() * 1024));
var j = Math.round((Math.random() * 768));
A25.style.left=i+'px';
A25.style.top=j+'px';
}
//-->
</script>

<!-------------------------------------------------------->
<!-----------------Count Layers--------------------------->
<!-------------------------------------------------------->
<!-------------------------------------------------------->

<!-------------------------------------------------------->
<!-----------------Text Output Checkbox------------------->
<!-------------------------------------------------------->
<!-------------------------------------------------------->


<script language="JavaScript" type="text/javascript">
<!--
var aCheckboxID = ['Auto','Money','Music'];
function writeChecksToText() {
var s = new Array;
for ( var i = 0; i < aCheckboxID.length; i++ ) {
if ( document.checkboxform[aCheckboxID[i]].checked )
s.push(aCheckboxID[i]);
}
document.checkboxform.T.value = "Hoofd catagorie: "+s.join();
}
//-->
</script>

<script language="JavaScript" type="text/javascript">
<!--
var bCheckboxID = ['Sex','Family'];
function writeChecksToText02() {
var g = new Array;
for ( var h = 0; h < bCheckboxID.length; h++ ) {
if ( document.checkboxform[bCheckboxID[h]].checked )
g.push(bCheckboxID[h]);
}
document.checkboxform.Q.value = "Sub catagorie: "+g.join();
}
//-->
</script>

<!-------------------------------------------------------->
<!-------------------Hide+Show Layers--------------------->
<!-------------------------------------------------------->
<!-------------------------------------------------------->

<script language="JavaScript">
function HideAll(){
var els = document.getElementsByTagName("div");
var len = els.length;
for(var n=0;n<len;n++){
var obj = els[n];
obj.style.visibility="hidden";
javascript: Hide();
}
}
</script>

<SCRIPT LANGUAGE="JavaScript">
function Hide() {
for (var j = 1; j <= 3; j++) {
box = eval("document.checkboxform.C" + j);
if (box.checked == true)
javascript: ShowChosen(''+j);
<!--alert(""+j);-->
}
}
</script>

<script language="JavaScript">
<!--
function ShowChosen(pat){
var els = document.getElementsByTagName("div");
var len = els.length;
for(var n=0;n<len;n++){
var obj = els[n];
if(obj!=null && obj.id.match(pat)){
obj.style.visibility="visible";
}
}
}
function MM_callJS(jsStr) { //v2.0
return eval(jsStr)
}
//-->
</script>

<!-------------------------------------------------------->
<!------------------Begin Body---------------------------->
<!------------------Layers(DIV)--------------------------->
<!-------------------------------------------------------->




</head>

<body onload="positionLayer();MM_callJS('writeChecksToText();');MM_callJS('writeChecksToText02();');MM_callJS('Cou ntLayers();')" bgcolor="#00FF00">
<div id="A1" style="position:absolute; left:0; top:0; width:176px; height:168px; z-index:1">
<p>a1</p>
</div>
<div id="A2" style="position:absolute; left:95px; top:201px; width:249px; height:208px; z-index:2">
<p>b1</p>
</div>
<div id="A3" style="position:absolute; left:762px; top:194px; width:248px; height:235px; z-index:3">
<p>c1</p>
</div>


<div id="A25" style="position:absolute; left:839px; top:371px; width:202px; height:199px; z-index:4">
<p>d1</>
</div>
<div id="A13" style="position:absolute; left:92px; top:205px; width:129px; height:132px; z-index:5">
<p>e1</p>
</div>
<center>

<!-------------------------------------------------------->
<!---------------------Form------------------------------->
<!-------------------------------------------------------->
<!-------------------------------------------------------->
<form name=checkboxform action="#">
<p>
<input name=C1 type=checkbox id="Auto" onclick="HideAll(); document.checkboxform.C4.checked = this.checked; document.checkboxform.C5.checked = this.checked; writeChecksToText(); writeChecksToText02()" checked>
Auto<br>
<input name=C2 type=checkbox id="Money" onClick="HideAll(); writeChecksToText(); writeChecksToText02()" checked>
Money <br>
<input name=C3 type=checkbox id="Music" onClick="HideAll(); writeChecksToText(); writeChecksToText02()" checked>
Music</p>
<p>
<input name=C4 type=checkbox id="Sex" onClick="HideAll(); writeChecksToText(); writeChecksToText02()" checked>
Sex<br>
<input name=C5 type=checkbox id="Family" onClick="HideAll(); writeChecksToText(); writeChecksToText02()" checked>
Family</p>
<p>
<input type="text" name="T" id="T" size="100%">
<br>
<input type="text" name="Q" id="Q" size="100%">
<br>
</p>
</form>
</center>
</html>


you can copy and paste this to see how it works..