Hjælp mig lidt
Jeg har nettop siddet og leget med scriptet fra, bratta.com nemlig dette----
<html>
<head>
<title>Cross-browser Dynamic HTML Scripts - DragDrop</title>
<style type=\"text/css\">
#divDrag0{position:absolute; left:0; top:0; visibility:hidden; clip:rect(0,200,200,0); height:200; width:200; layer-background-color:blue; background-color:blue}
#divDrag1{position:absolute; left:0; top:0; visibility:hidden; clip:rect(0,100,30,0); height:30; width:100; layer-background-color:red; background-color:yellow}
#divDrag2{position:absolute; left:0; top:0; visibility:hidden; clip:rect(0,100,100,0); height:100; width:100; layer-background-color:red; background-color:red}
#divDrag3{position:absolute; left:0; top:0; visibility:hidden; clip:rect(0,220,150,0); height:150; width:220; layer-background-color:red; background-color:green; layer-background-image:url(\'images/back.jpg\'); background-image:url(\'images/back.jpg\')}
</style>
<script type=\"text/javascript\" language=\"JavaScript\">
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
Visit for more great scripts. This may be used freely as long as this msg is intact!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf(\"MSIE 5\")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new checkBrowser()
//How many layers do you have??
numdrag=4
/********************************************************************************
Remember to set the width and height to the same as the clip values when
you change on the layers. If you are adding a image in one of the layers
do like I have done on divDrag3 (see style), add is as a background-image.
Then the drag will be smoother. Remember to set the the height, width and clip
to the exact same as the size of you image.
********************************************************************************/
/********************************************************************************
Object constructor part.
Setting the objects methods and properties
********************************************************************************/
function dragObj(obj,nest){
nest=(!nest) ? \'\':\'document.\'+nest+\'.\'
this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+\"document.layers.\" +obj):0;
this.evnt=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+\"document.layers.\" +obj):0;
this.x=(bw.ns4 || bw.ns5)? this.css.left:this.css.pixelLeft;
this.y=(bw.ns4 || bw.ns5)? this.css.top:this.css.pixelTop;
this.moveIt=b_moveIt;
this.drag=false;
this.clickedX=0; this.clickedY=0
return this
}
function b_moveIt(x,y){
this.x=x; this.y=y;
this.css.left=this.x
this.css.top=this.y
}
function mmover(e){
tp=(bw.ns5 || bw.ns4)?e.target.name:window.event.srcElement.tagName
if(tp==\"DIV\" || bw.ns4 || bw.ns5){
num=(bw.ns4 || bw.ns5)?e.target.id.substr(7,2):(bw.ie4 || bw.ie5)?window.event.srcElement.id.substr(7,2):0
oDrag[parseInt(num)].isOver=true
}
}
function mmout(e){
tp=(bw.ns5 || bw.ns4)?e.target.name:window.event.srcElement.tagName
if(tp==\"DIV\" || bw.ns4 || bw.ns5){
num=(bw.ns4)?e.target.id.substr(7,2):(bw.ie4 || bw.ie5)?window.event.srcElement.id.substr(7,2):0
if(bw.ns5) for(var i=0; i<oDrag.length;i++){oDrag[i].isOver=false}
else oDrag[parseInt(num)].isOver=false
}
}
function mup(){
for(var i=0; i<oDrag.length;i++){
if(oDrag[i].isOver) {
oDrag[i].drag=false
}
}
}
function mdown(num){
x=(bw.ns4 || bw.ns5)?num.pageX:event.x
y=(bw.ns4 || bw.ns5)?num.pageY:event.y
for(var i=0; i<oDrag.length;i++){
if(oDrag[i].isOver) {
oDrag[i].drag=true
oDrag[i].clickedX=x-oDrag[i].x
oDrag[i].clickedY=y-oDrag[i].y
cZIndex++
oDrag[i].css.zIndex=cZIndex
}
}
}
function mmove(e){
x=(bw.ns4 || bw.ns5)?e.pageX:event.x
y=(bw.ns4 || bw.ns5)?e.pageY:event.y
for(var i=0; i<oDrag.length;i++){
if(oDrag[i].drag){
oDrag[i].moveIt(x-oDrag[i].clickedX,y-oDrag[i].clickedY)
}
}
return false
}
/********************************************************************************
Set this variable to the zIndex you want it to start at, (if you have several
layers and want it to start on the top, change to somthing higher then the uppermost layer
********************************************************************************/
cZIndex=10
/********************************************************************************
Making objects, Capturing events, when the user mouseovers a layer
the variable/property of that layer names .isOver will
be true, and that means if the user clicks
when he is on top of that layer it becomes draggable
********************************************************************************/
function dragInit(){
oDrag=new Array()
for(i=0;i<numdrag;i++){
oDrag[i]=new dragObj(\'divDrag\'+i)
oDrag[i].evnt.onmouseover=mmover;
oDrag[i].evnt.onmouseout=mmout;
}
if(bw.ns4) document.captureEvents(Event.MOUSEMOVE | Event.MOUSEDOWN | Event.MOUSEUP)
document.onmousedown=mdown
document.onmouseup=mup
document.onmousemove=mmove;
//HERE YOU CAN MOVE THE LAYERS TO A POSITION IF YOU WANT TO BEFORE THEY ARE SHOWN.
oDrag[0].moveIt(80,150)
oDrag[1].moveIt(130,120)
oDrag[2].moveIt(170,190)
oDrag[3].moveIt(200,210)
//Showing the layers
for(i=0;i<numdrag;i++){
oDrag[i].css.visibility=\'visible\'
}
}
onload=dragInit;
</script>
</HEAD>
<BODY bgcolor=\"#ocococ\">
<div id=\"divDrag0\">Drag me! <a href=\"#\">here</a></div>
<div id=\"divDrag1\">Drag me!</div>
<div id=\"divDrag2\">Drag me!</div>
<div id=\"divDrag3\">Drag me!</div>
YOUR REGULAR BODY CONTENT GOES IN HERE
</BODY>
</HTML>
----
Nu er mine spørgsmål dette.
Kan jeg lave
#divDrag0{position:absolute; left:0; top:0; visibility:hidden; clip:rect(0,200,200,0); height:200; width:200; layer-background-color:blue; background-color:blue} til transparent istedet? og hvordan
Og kan jeg lave en lukkning af et enkelt layer og hvordan, samt rezise det?
Håber i kan hjælpe da jeg sidder fortabt i dhtml
