7-8.htm

来自「JScript网页特效,包含很多的实现网页特效的方法.」· HTM 代码 · 共 152 行

HTM

152 行

<html>
<head>
<title>§7.8 可以用鼠标随意移动的图片</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
	#plane1 {position:absolute; left:200; top:70; width:121; z-index:0}
</style>

<script LANGUAGE="JavaScript">
var isNav, isIE
if (parseInt(navigator.appVersion) >= 4) 
{
  if (navigator.appName == "Netscape") 
  {
    isNav = true
  } 
  else
  {
    isIE = true
  }

}

function setZIndex(obj, zOrder) 
{
  obj.zIndex = zOrder
}


function shiftTo(obj, x, y) 
{
  if (isNav) 
  {
    obj.moveTo(x,y)
  } 
  else 
  {
    obj.pixelLeft = x
    obj.pixelTop = y
  }
}

var selectedObj
var offsetX, offsetY

function setSelectedElem(evt) 
{
  if (isNav) 
  {
    var testObj
    var clickX = evt.pageX
    var clickY = evt.pageY
    for (var i = document.layers.length - 1; i >= 0; i--) 
    {
      testObj = document.layers[i]
      if ((clickX > testObj.left) && 
          (clickX < testObj.left + testObj.clip.width) && 
          (clickY > testObj.top) && 
          (clickY < testObj.top + testObj.clip.height)) 
      {
        selectedObj = testObj
        setZIndex(selectedObj, 100)
        return
      }
    }
  }
  else
  {
    var imgObj = window.event.srcElement
    if (imgObj.parentElement.id.indexOf("plane") != -1) 
    {
      selectedObj = imgObj.parentElement.style
      setZIndex(selectedObj,100)
      return
    }
  }
  selectedObj = null
  return
}


function dragIt(evt)
{
  if (selectedObj) 
  {
    if (isNav) 
    {
      shiftTo(selectedObj, (evt.pageX - offsetX), (evt.pageY - offsetY))
    } 
    else 
    {
      shiftTo(selectedObj, (window.event.clientX - offsetX), (window.event.clientY - offsetY))
      return false
    }
  }

}

function engage(evt) 
{ 
  setSelectedElem(evt)
  if (selectedObj) 
  {
    if (isNav) 
    {
      offsetX = evt.pageX - selectedObj.left
      offsetY = evt.pageY - selectedObj.top
    } 
    else 
    {
      offsetX = window.event.offsetX
      offsetY = window.event.offsetY
    }
  }
return false
}

function release(evt) 
{
  if (selectedObj) 
  {
    setZIndex(selectedObj, 0)
    selectedObj = null
  }
}

function setNavEventCapture() 
{
  if (isNav) 
  {
    document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)
  }
}

function init() 
{
  if (isNav) 
  {
    setNavEventCapture()
  }
  document.onmousedown = engage
  document.onmousemove = dragIt
  document.onmouseup = release
}
</script> 
</head>

<body bgcolor="#FFFFFF" onLoad="init()">
<DIV ID=plane1><IMG NAME="planePic1" SRC="100-1.gif" BORDER=0></DIV>
</body>
</html>

7-8.htm - 源码说明

本页面展示了「JScript网页特效,包含很多的实现网页特效的方法.」中的 7-8.htm 源码文件，采用 HTM 编程语言编写，共 152 行代码。您可以在线阅读完整代码内容，也可以返回资源详情页下载完整源码包进行本地学习和开发。

虫虫下载站收录了大量与JScript相关的技术资源，包括源代码、技术文档、电路图等，是电子工程师和嵌入式开发者的专业学习平台。

⌨️ 快捷键说明

复制代码Ctrl + C

搜索代码Ctrl + F

全屏模式F11

增大字号Ctrl + =

减小字号Ctrl + -

显示快捷键?