为你的DHTML添活力

时间:2010-03-30 16:51:00  来源:第二电脑网  作者:第二电脑网

  第二电脑网导读:开发者免受网络浏览器与互操作解决方案的限制。但是,局限于Flash让你无法体验到网络浏览器的许多特色。例如,你可以通过IE为HTML元素添加行为,建立对象面向的页面设计方法。在这个例子中,我会建立了一个<DIV>对象,当用户拖动它时,它会在限定的<DIV>内继续定向运行。为HTML添加行为的能力是设计的一个关键部分。在IE中,这通过相关的样式来实现。添加行为...
  正文:

*purpleendurer修正了原文中的一些错误

你可以通过IE为你的HTML元素添加行为,建立面向对象的页面设计方法。Phillip Perkins建立了一个<DIV>对象,当用户拖动它时,它会在限定的<DIV>内继续定向运行。

Macromedia Flash可以使开发者免受网络浏览器与互操作解决方案的限制。但是,局限于Flash让你无法体验到网络浏览器的许多特色。

例如,你可以通过IE为HTML元素添加行为,建立对象面向的页面设计方法。在这个例子中,我会建立了一个<DIV>对象,当用户拖动它时,它会在限定的<DIV>内继续定向运行。

为HTML添加行为的能力是设计的一个关键部分。在IE中,这通过相关的样式来实现。添加行为的样式特性即“behavior”。你可以通过嵌套的<STYLE>标签来添加行为,就像这样:

<style>DIV.object { behavior: url(Behavior.htc);}

从这段脚本中,你可以发现一个行为会提及到一个HTC(HTML组件)文件。既然我们具有对象化这些HTML元素的基础,我们就能建立控制它们的行为脚本。

表A中包含了为我们的嵌套<DIV>对象建立行为的所有代码。在这一个组件内就有许多的代码。

表 A --文件component.htc的内容


<public:component lightweight="true">

<public:attach event="onmousedown" onevent="element_onmousedown()"/>

<public:attach event="onmousemove" onevent="element_onmousemove()"/>

<public:attach event="onmouseup" onevent="element_onmouseup()"/>

<public:attach event="onmouSEOut" onevent="element_onmouseup()"/>

<public:attach event="onselectstart" onevent="element_onselectstart()"/>

<public:attach event="ondragstart" onevent="element_ondragstart()"/>

<public:attach event="onload" for="window" onevent="Init()"/>

<public:method name="moveMe"/>

<public:property name="clickPoint" get="get_clickPoint" put="put_clickPoint"/>

<public:property name="interval" get="get_interval" put="put_interval"/>

<script language="JScript">
var m_bStarted = false;
var m_bMoving = false;
var m_clickPoint = null;
var m_tStart = 0;
var m_tEnd = 0;
var m_ptStart = null;
var m_Slope = null;
var m_interval = 0;
var m_isMoving = false;
var m_trash = 0;
var m_dX = 0;
var m_dY = 0;
var m_vectX = 0;
var m_vectY = 0;
var m_pNode = null;
var m_bounds = [];
var BOUNDS = {"left":0,"top":1,"right":2,"bottom":3};
var m_dimensions = [];
var DIMS = {"width":0,"height":1};

 

function Init()
{
    element.id = element.document.uniqueId;
    var m_pNode = element.parentNode;
    m_bounds = [
  0,
  0,
                parseInt(m_pNode.currentStyle.width),
                parseInt(m_pNode.currentStyle.height)
                ];
    m_dimensions = [
    Node            parseInt(element.offsetWidth),
                parseInt(element.offsetHeight)
                ];

}

function element_onmousedown()
{
    m_bStarted = true;
    m_tStart = new Date();
    clearInterval(m_interval);
    m_Slope = null;
    m_ptStart = null;
    m_trash = 0; "为你的DHTML添活力"由第二电脑网原创提供,转载请注明:http://www.002pc.com/master/College/Programming/JavaScript/13409.html

 1/4    1 2 3 4 下一页 尾页


关键字:

关于《为你的DHTML添活力》文章的评论

站内搜索: 高级搜索

热门搜索: Windows style 系统 tr IP QQ CPU 安装 function 注册 if td