Question

我想使用javascript函数调整div的位置。我试图解决这个问题，但这不是正常的工作。在the div中只拖了右边。我想让用户在div2上拖动光标，然后改变光标的样式，每当用户按下鼠标左键并拖动左侧时，应该减小div1的大小并向右拖动然后侧面应该增加。我的代码在这里。

    <div onmousedown="dStarted(event);" onmousemove="dMoving(event,this);" onmouseup="dEnd(event,this);" style="float: left; height: 100%; border-right: solid 1px black; background-color:LightGrey" id="div1">
        <a href="#" onclick="toggle();">
            <img style="background-color:White;" id="imgToggle" />
        </a>
    </div>
    <div style="float: left; height: 100%;" runat="server" id="div3">
        <iframe frameborder="0" framespacing="0" id="frame2" runat="server" height="100%" width="100%" noresize="noresize" class="WZSplitterPanel"></iframe>
    </div>

        var dragged=false;
        function dStarted(event)
        {
            dragged =true;
        }


        function dMoving(event,ele)
        {
                ele.style.cursor = "e-resize";
                var div2 =document.getElementById("div2");
                div2.style.width = event.x;
                var frm1=document.getElementById("frame1");
                frm1.style.width=div2.style.width;
        }

        function dEnd(event, ele)
        {
            if(dragged)
            {
                ele.style.cursor = "default";
                dragged=false;
            }
            return;
        }

在该大小只增加和光标样式不正常工作。我把光标移到div2然后光标闪烁。

我有3个div，在div2（id =“div2”）中取一个iframe id =“frame1”并在div1 id =“div1”中取一个图像而div3 id“div3”取一帧id =“frame2 ”。我想在向右拖动光标然后div2和frame1大小应该减少。

Answer 1

尝试更改javascript中的id，以匹配HTML中我开始的位置。还要确保您的浏览器错误控制台中没有出现错误。

如何使用javascript和html增加和减少div的大小

1 个答案: