Jump to content


Photo

Problem with minimizing a Div


  • Please log in to reply
No replies to this topic

#1 Venus

Venus
  • New Members
  • Pip
  • Newbie
  • 1 posts

Posted 04 August 2006 - 05:14 AM

Greetings I am creating "floating regions" and am having a problem with my javascript function.

I am trying to get rid of tables completely from my site layout, I want to make what I call a region (a window with a header on it) dissapear and reappear when you click the _ and + button respectively. (only the content part, not the header) The problem is this code seems to only work when the title bar element is a TD and not when it is a strait DIV

The error I am receiving is...Error in parsing value for property 'top'. Declaration dropped.

This is the code I am trying to make work...
<script language="JavaScript">
<!--

//zIndex counter
var z=100;
var xleft=150;
var xright=150;

var ie=document.all;
var firefox=document.getElementById&&!document.all;

var isDrag=false;
var x,y;
var dobj;

function mouseMove(e)
{
  if (isDrag)	//only move the box if the user is dragging it
  {	
	if (firefox)
	{
		dobj.style.left = e.clientX + (tx - x);
		dobj.style.top  = e.clientY + (ty - y);
	}
	else
	{		//IE
		dobj.style.left = event.clientX + (tx - x);
		dobj.style.top  = event.clientY + (ty - y);
	}    
  }
}

//handle click on widget title bar
function selectMouse(e) 
{	
	if (firefox){
		//verify that user clicked the 'titlebar' element 
		var p=e.target;	
		if (p.attributes['id'] && p.attributes['id'].value.indexOf("titlebar")!=-1)
		{
			isDrag=true;
			x=e.clientX;
			y=e.clientY;
			//get the widget coordinates from the widget root
			var pstr=p.attributes['id'].value;
			var temp=pstr.substring(pstr.indexOf('_')+1,pstr.length);
			dobj=document.getElementById('Region_'+temp);
			//record widget location
			tx=parseInt(dobj.style.left);
			ty=parseInt(dobj.style.top);
			//change zIndex
			dobj.style.zIndex=z; z++;
		}
	}
	else{ //IE
		//verify that user clicked the 'titlebar' element
		var p=event.srcElement;		
		if (p.attributes['id'] && p.attributes['id'].value.indexOf("titlebar")!=-1)
		{
			isDrag=true;
			x=event.clientX;
			y=event.clientY;
			//get the widget coordinates from the widget root
			var pstr=p.attributes['id'].value;
			var temp=pstr.substring(pstr.indexOf('_')+1,pstr.length);			
			dobj=document.getElementById('Region_'+temp);
			//record widget location
			tx=parseInt(dobj.style.left);
			ty=parseInt(dobj.style.top);
			//change zIndex
			dobj.style.zIndex=z; z++;
		}
	}
}

function MinMax(ID)
{
	Reg = document.getElementById('Content_'+ID)
	MM = document.getElementById('MinMax_'+ID)
	
	if (Reg.style.visibility == "hidden")
	{
	Reg.style.visibility = "visible";
	MM.innerHTML = "<a href ='#' onclick='MinMax("+ID+")'>+</a>";
	}
	else
	{
	Reg.style.visibility = "hidden";
	MM.innerHTML = "<a href ='#' onclick='MinMax("+ID+")'>_</a>";
	}
	
}
document.onmousemove=mouseMove;
document.onmousedown=selectMouse;
document.onmouseup=function(){
	isDrag=false;
	dobj=null;
}
//-->
</script>
 </head>
 
 <body>
 <?PHP
 
 include 'Globals.php';
 global $conn, $error;
 if (!$conn)
  {exit("Connection Failed: " . $conn);} //SO it doesnt try to keep loading the page.
  
  	$sql = "SELECT * FROM Regions";
	$sqlconn =odbc_exec($conn,$sql);
	
	if (!odbc_exec($conn, $sql))
	{
		die($error & ' problem occured LoadingRegions');
	}
	else
	{
		while (odbc_fetch_row($sqlconn))
			{
			CreateRegion(odbc_result($sqlconn,"ID"), odbc_result($sqlconn,"RegionName"), odbc_result($sqlconn,"Content"));
			}
    }

function CreateRegion($RegionID, $RegionName, $RegionContent)
	{
	echo 
	"<div id='Region_".$RegionID."' style='position: absolute; width:100;'>	
		<div>
			<b align=left id='titlebar_".$RegionID."'>".$RegionName."</b>
			<b align=right id='MinMax_".$RegionID."'><a href ='#' onclick='MinMax($RegionID);'>_</a></b>	
		</div>		
		<div id='Content_".$RegionID."'style='padding: 5px; font-family: arial; font-size: 8pt; width: 100%'>".
		$RegionContent."
		</div>
	</div>";
	}

And this is the region that worked before, its not in a function like the other one is, this is a backup copy from old code.

echo 
	"<div id='Region_".$RegionID."' style='position: absolute;'>	
		<div style='cursor: move; width: 100%; height: 16; background-color: #CCCCFF; border-bottom: 1px solid #CACACA; '>
			<table  style='font-family: arial; font-size: 8pt;' width=100% cellpadding=0 cellspacing=0 border=0>
				<tr>
					<td align=left id='titlebar_".$RegionID."' style='padding-left: 5px;'>".$RegionName."</td>
					<td align=right id='MinMax_".$RegionID."'><a href ='#' onclick='MinMax($RegionID);'>_</a></td>
				</tr>
			</table>
		</div>
		<div id='Content_".$RegionID."'style='padding: 5px; font-family: arial; font-size: 8pt; width: 100%'>".
		$RegionContent."
		</div>
	</div>";


I have a feeling I misnamed something when I was editing, or I have to call a div's style in some different way than a td, but I can't find anything that says that would be true. If anyone could help me with this I would sincerely apreciate it. I have an entire site to write and staring at this for hours is not what I would consider productive.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users