如何创建与原型

该分隔符实际上是表格行中包含的表格单元格。它维护一个background-color和background-image，使其具有类似于您在桌面应用程序中看到的效果。

我不确定你想要做什么，但假设表格单元格已经在标记中指定，并且它具有适当的样式，您需要设置几件事情：

A mousedown处理程序用于注册用户何时点击单元格。
A mousemove用于更新浏览器窗口上下文中分隔符位置的处理程序。
A mouseup处理程序知道何时停止更新分隔符的位置。

有关于如何做到这一点的变化，但这里是一个非常，非常粗略的例子：

var bMouseIsDown = false; 
Event.observe('separator', 'mousedown', function() { 
    bMouseIsDown = true; 
}); 
Event.observe('separator', 'mouseup', function() { 
    bMouseIsDown = false; 
}); 

Event.observe('separator', 'mousemove', function(evt) { 
    if(bMouseIsDown === true) { 
    var iX = Event.pointerX(evt); 
    var iOffsetX = iX - Position.page($('separator'))[0]; 
    var iWidth = $('separator').getDimensions().width; 
    var iElementOffset = iWidth - iOffsetX; 
    $(this).setStyle({ 
     left: iX - iElementOffset 
    }); 
    } 
});

来源

2009-07-16 12:16:23 Tom

如果您已经使用原型，您可以使用Scriptaculous draggable得到分离工作，然后挂钩其事件以相应地调整两个DIV的大小。

来源

2009-07-16 13:23:00

如何创建与原型

回答

相关问题