1
Hi,
I am new to this.Before explaining my problem i would like you guys watch this site. http://www.blogger.com,register in the site and try to post one artilce ,while posting you can observe on the top somthing like templates. By using that option user can change his template as he likes. Suppose in the blogger page about me ,recent post and something may exists,the user can change those positions by selecting them. I tried to do that using div tag and innerHTML. When user is changing automatically the html code should be changed. When user is visiting for the next time what are changes he made in that manner only he can able to c the template. So any one help me in doing this.
Till now i have done this.You can test this .
<html>
<head>
<style>
<!--
.drag{position:relative;cursor:hand}
--></style>
<script language="JavaScript1.2">
<!--
/*
Drag and Drop Script-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com
*/
var dragapproved=false
var z,x,y
function move(){
if (event.button==1&&dragapproved){
z.style.pixelLeft=temp1+event.clientX-x
z.style.pixelTop=temp2+event.clientY-y
return false
}
}
function drags(){
if (!document.all)
return
if (event.srcElement.className=="drag"){
dragapproved=true
z=event.srcElement
temp1=z.style.pixelLeft
temp2=z.style.pixelTop
x=event.clientX
y=event.clientY
document.onmousemove=move
}
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")
//-->
</script>
<script language="javascript" type="text/javascript">
function changeFun()
{
alert(document.getElementById('getDiv').innerHTML) ;
//document.getElementById('getDiv').innerHTML = "Yes,this is for testing";
return false;
}
</script>
</head>
<body>
<form name="form1" method="post" action="" onSubmit="return changeFun();">
<table>
<div id="getDiv">
fgfgfg
</div>
<tr><td>
<table width="493" height="130" border="1">
<tr>
<td width="250" class="drag">hai</td>
<td width="227" class="drag">this </td>
</tr>
<tr>
<td class="drag">is </td>
<td class="drag">talluri</td>
</tr>
</table>
</td></tr>
<!-- <tr>
<td><iframe name="getData" id="getData" src="get.php" width="500" height="500"></iframe></td>
</tr>-->
<tr>
<td align="center" valign="middle"><input type="submit" name="Submit" value="Submit"></td>
</tr>
</table>
</form>
</body>
</html>
Any suggestion is accepted.Thanks in advance.
Thanks,
Talluri
