본문 바로가기

Front-end/HTML

HTML+CSS: Can I fixed div element position when the size change?

![first position. When I try to resize(by the red point)][1]






![It is moving while dragging(change size)][2]

but When the element(ruler) is horizontal mode. it works fine.

please help me T_T

here is part of the source

ruler.css({
    width: e.pageY -ruler.offset().top
});

full source is here.

$.event.add( document, "mousemove", function(e){
e.stopPropagation(e);
if(ruler_resize_active) {
    console.log(".ruler-resize:mousemove");
    console.log(ruler.offset().left);
    console.log(ruler.offset().top);
    if(options.orientation == "vertical") {
            ruler.css({
             width: e.pageY - ruler.offset().top
        });
            }
     }
});




http://jsfiddle.net/Bst6G/



이렇게 하면 됩니다.





var ruler = $(this)
    .addClass('ruler')
    .css({
        minWidth: options.minWidth,
        maxWidth: options.maxWidth,
        width: options.width,
        webkitTransformOrigin: "top left"
    });

http://jsfiddle.net/Bst6G/3/