Page 1 of 1
to make it visible or not.
Posted: Sun Oct 17, 2004 5:17 pm
by mudkicker
Code: Select all
// JavaScript Document
var DHTML = (document.getElementById || document.all || document.layers);
function getObj(name)
{
if (document.getElementById)
{
this.obj = document.getElementById(name);
this.style = document.getElementById(name).style;
}
else if (document.all)
{
this.obj = document.allїname];
this.style = document.allїname].style;
}
else if (document.layers)
{
this.obj = document.layersїname];
this.style = document.layersїname];
}
}
function invi(name)
{
if (!DHTML) return;
var x = new getObj(name);
if(x.style.visibility == 'hidden')
{
x.style.visibility = 'visible';
}
else
{
x.style.visibility = 'hidden';
}
}
this is the code i use to make a dropdown layer visible or hidden.
i have three layers to add, to edit or to delete sometihng (imagin google's interface it's kind a like it) but this doesn'T work properly. I always have to click 2 times to get it work.
and one more question how can I make it collapse. I mean if i click add it expands add layer and collapses other 2 (edit and delete) layers?
thanks,
arif
Posted: Sun Oct 17, 2004 8:44 pm
by feyd
As for having to click twice, I'm not sure without seeing it in action.
As for collpasing other layers: running over all the names of the "layers" flipping their visibilities based on the one asked for is how I always do it.
Posted: Sun Oct 17, 2004 9:33 pm
by mudkicker
But they are sortind down-under and if i click to make it visible it opens wide down.
part of html file
Code: Select all
<td id="content">
<h1>
<img src="../images/admin/add.png" width="24" height="24" /> <a href="#" onclick="javascript:nav('add');">ADD</a>
<img src="../images/admin/edit.png" width="24" height="24" /> <a href="javascript:nav('edit');">EDIT</a>
<img src="../images/admin/del.png" width="24" height="24" /> <a href="javascript:nav('delete');">DELETE</a>
</h1>
<div id="add">
<form action="addnews.php" method="post" enctype="multipart/form-data">
<fieldset><legend>Header</legend><input name="header" type="text" size="40" /></fieldset>
<fieldset><legend>Content</legend><textarea name="content" cols="45" rows="8"></textarea></fieldset>
<fieldset><legend>Image For This Subject</legend>
<label><input type="radio" name="RadioGroup1" value="Yes" />Yes</label>
<label><input type="radio" name="RadioGroup1" value="No" />No</label>
<input name="imginput" type="file" size="40" />
</fieldset>
<fieldset><legend>News Type</legend>
<select name="type">
<option value="HEAD">HEADNEWS</option>
<option value="NORM">NEWS</option>
<option value="BOTH">BOTH</option>
</select></fieldset>
<input name="add_news_submit" type="submit" value="Add" />
</form>
</div>
<div id="edit">Edit mode</div>
<div id="delete">News mode</div> </td>
js file :
Code: Select all
var ns4 = (document.layers);
var ie4 = (document.all && !document.getElementById);
var ie5 = (document.all && document.getElementById);
var ns6 = (!document.all && document.getElementById);
function show(id){
// Netscape 4
if(ns4){
document.layersїid].visibility = "show";
}
// Explorer 4
else if(ie4){
document.allїid].style.visibility = "visible";
}
// W3C - Explorer 5+ and Netscape 6+
else if(ie5 || ns6){
document.getElementById(id).style.visibility = "visible";
}
}
function hide(id){
// Netscape 4
if(ns4){
document.layersїid].visibility = "hide";
}
// Explorer 4
else if(ie4){
document.allїid].style.visibility = "hidden";
}
// W3C - Explorer 5+ and Netscape 6+
else if(ie5 || ns6){
document.getElementById(id).style.visibility = "hidden";
}
}
function nav(id) {
// Netscape 4
if(ns4){
if(document.layersїid].visibility == "hide") {
show(id);
}
else {
hide(id);
}
}
// Explorer 4
else if(ie4){
if(document.allїid].style.visibility == "hidden") {
show(id);
}
else {
hide(id);
}
}
// W3C - Explorer 5+ and Netscape 6+
else if(ie5 || ns6){
if(document.getElementById(id).style.visibility == "hidden") {
show(id);
}
else {
hide(id);
}
}
}