e-gradiva     HTML CSS JavaScript Načrtovanje    
  logotip  
SERŠ Maribor Iskanje Primeri

Primi in spusti

Koda:
<style type="text/css">
img#smesko
{
position:relative;
}
</style>

<script type="text/javascript">
mouseover=true

function koordinate()
{
if (!smesko)
	{
	return
	}
if (event.srcElement.id=="smesko")
	{
	mouseover=true
	pleft=document.getElementById("smesko").style.pixelLeft
	ptop=document.getElementById("smesko").style.pixelTop
	xcoor=event.clientX
	ycoor=event.clientY
	document.onmousemove=premakniSliko
	}
}

function premakniSliko()
{
if (mouseover&&event.button==1)
	{
	document.getElementById("smesko").style.pixelLeft=pleft+event.clientX-xcoor
	document.getElementById("smesko").style.pixelTop=ptop+event.clientY-ycoor
	return false
	}
}

function mouseup()
  {
  mouseover=false
  }

document.onmousedown=koordinate
document.onmouseup=mouseup

</script>

<img id="smesko" src="slike/smesko.gif" alt=":)" />
Izgled v
brskalniku:

Primi Smeška in ga spusti na drugem mestu!

:)

Razlaga: Če hočemo premakniti slikico smeško, morata najprej biti izpolnjena dva pogoja, vrednost1 je onmouseover=true ta pogoj, preveri, če se miška nahaja nad slikico, vrednost2 pogoj je pa ta, da moramo ko smo nad slikico pritisniti levi miškin gumb. Ko sta ta dva pogoja izpolnjena, lahko premaknemo slikico na želeno mesto, in spustimo levi miškin gumb, če želimo slikico tam pustiti.

SERŠ Maribor : Strokovna gimnazija : 2004 : Davorin Lenart