HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>LAURA COSTELLOE | Graphic Designer Portfolio | Vector Illustration, Graphic Illustration and a little bit of Web Design!</title>
<meta name="description" content="Laura Costelloe is a Graphic Design student studying at Leeds Metropolitan University. She specialises in Illustrations of females in punk style, rock style
and on the subject of feminism versus female enpowerment." />
<meta name="keywords" content="Laura Costelloe, Graphic Design, Illustration, Leeds Met Uni, Graphic Arts and Design, Learning Agreement, BA (HONS), vector illustrations." />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/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);
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="http://www.lauracostelloe.co.uk/styles/style.css" rel="stylesheet" type="text/css">
<style type="text/css">
.drag{
position:relative;
cursor:hand;
z-index: 100;
}
</style>
<script type="text/javascript">
/***********************************************
* Drag and Drop Script: © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
var dragobject={
z: 0, x: 0, y: 0, offsetx : null, offsety : null, targetobj : null, dragapproved : 0,
initialize:function(){
document.onmousedown=this.drag
document.onmouseup=function(){this.dragapproved=0}
},
drag:function(e){
var evtobj=window.event? window.event : e
this.targetobj=window.event? event.srcElement : e.target
if (this.targetobj.className=="drag"){
this.dragapproved=1
if (isNaN(parseInt(this.targetobj.style.left))){this.targetobj.style.left=0}
if (isNaN(parseInt(this.targetobj.style.top))){this.targetobj.style.top=0}
this.offsetx=parseInt(this.targetobj.style.left)
this.offsety=parseInt(this.targetobj.style.top)
this.x=evtobj.clientX
this.y=evtobj.clientY
if (evtobj.preventDefault)
evtobj.preventDefault()
document.onmousemove=dragobject.moveit
}
},
moveit:function(e){
var evtobj=window.event? window.event : e
if (this.dragapproved==1){
this.targetobj.style.left=this.offsetx+evtobj.clientX-this.x+"px"
this.targetobj.style.top=this.offsety+evtobj.clientY-this.y+"px"
// Added This <- Aurelius1664
GetPositions();
return false
}
}
}
dragobject.initialize()
/******************************************************
Aurelius1664 - Begins Here
******************************************************/
var _aimageDragable = null;
function PushPositions()
{
var asItems;
var asProperties;
var textPositions;
var sPositions;
var imageDragable;
// Read the text ready for repositioning
textPositions = document.getElementById("textPositions");
sPositions = textPositions.value;
if(sPositions.length == 0)
{
alert("Move things around then copy the text from the box to clipboard and reset. Paste the text back in and click 'put em back' and they'll magically reposition. If you set the display style on the text area to hidden when they submit it will be included with the comments. You can then have a version of the page you can paste in the text and reposition.");
return;
}
// Parse and push the items
asItems = sPositions.split("\n");
for(var iItemIndex = 0; iItemIndex < asItems.length; iItemIndex++)
{
asProperties = asItems[iItemIndex].split(",");
if(asProperties.length == 3 &&
asProperties[0].length > 0 &&
asProperties[1].length > 0 &&
asProperties[2].length > 0)
{
// Find the image and reset the position
imageDragable = document.getElementById(asProperties[0]);
if(imageDragable != null)
{
imageDragable.style.left = asProperties[1];
imageDragable.style.top = asProperties[2];
}
}
}
}
function GetPositions()
{
var aimageAll;
var sPositions;
var textPositions;
var iSavedIndex;
_aimageDragable = new Array();
iSavedIndex = 0;
aimageAll = document.getElementsByTagName("img");
for(iImageIndex = 0; iImageIndex < aimageAll.length; iImageIndex++)
{
// Get positions for all dragable images
if(aimageAll[iImageIndex].id.length > 0 && aimageAll[iImageIndex].className == "drag")
{
_aimageDragable[iSavedIndex] = new Object();
_aimageDragable[iSavedIndex].Name = aimageAll[iImageIndex].id;
_aimageDragable[iSavedIndex].X = aimageAll[iImageIndex].style.left;
_aimageDragable[iSavedIndex].Y = aimageAll[iImageIndex].style.top;
iSavedIndex++;
}
}
// Put the positions in the text box
sPositions = "";
for(iPosition = 0; iPosition < _aimageDragable.length; iPosition++)
{
sPositions += _aimageDragable[iPosition].Name + ",";
sPositions += _aimageDragable[iPosition].X + ",";
sPositions += _aimageDragable[iPosition].Y + "\n";
}
textPositions = document.getElementById("textPositions");
textPositions.value = sPositions;
}
function buttonRearrange_OnClick()
{
PushPositions();
}
/******************************************************
Aurelius1664 - Ends Here
******************************************************/
</script>
</head>
Dragable Elements - Get a screenshot when they leave the page?
Reply With Quote
Another idea..
Bookmarks