jQuery   发布时间:2022-03-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了javascript – Jquery放大和缩小工作与混蛋而不是平滑大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一块帆布.我必须缩放它直到按下放大按钮并缩小它直到按下缩小按钮.我设法让它工作,但它适用于延迟.即使我已经释放按钮,它也会一直放大或缩小.这是我到目前为止所尝试的.请帮我.您可以在现场超过 Here查看.

<script language="javascript">
    var timeout,clicker = $('#zoomin'),clicker2 = $('#zoomout');

    clicker.mousedown(function() {
        timeout = seTinterval(function() {
            var wd = $("#canvas").width();
            var ht = $("#canvas").height();
            wd = parseInt(wd) + 250;
            ht = parseInt(ht) + 250;
            $("#canvas").animate({
                width: wd,height: ht
            });
            var ctx = canvas.getContext("2d");
            ctx.drawImage(BACkgroundImage,wd - 1,ht - 1);
            ctx.drawImage(outlineImage,ht - 1);
            redraw();
        },500);

        return false;
    });

    clicker2.mousedown(function() {
        timeout = seTinterval(function() {
            var wd = $("#canvas").width();
            var ht = $("#canvas").height();
            wd = parseInt(wd) - 250;
            ht = parseInt(ht) - 250;
            if (wd < 500) {
                return false;
            }
            $("#canvas").animate({
                width: wd,500);

        return false;
    });

    $(document).mouseup(function() {
        clearInterval(timeout);
        return false;
    });

    $("#zoomout").mousedown(function() {
        var wd = $("#canvas").width();
        var ht = $("#canvas").height();
        wd = parseInt(wd) - 250;
        ht = parseInt(ht) - 250;
        if (wd < 500) {
            return false;
        }
        $("#canvas").animate({
            width: wd,height: ht
        });
        var ctx = canvas.getContext("2d");
        ctx.drawImage(BACkgroundImage,ht - 1);
        ctx.drawImage(outlineImage,ht - 1);
        redraw();
        console.log(wd + ":" + ht);
    });

    $("#zoomin").click(function() {
        var wd = $("#canvas").width();
        var ht = $("#canvas").height();
        wd = parseInt(wd) + 250;
        ht = parseInt(ht) + 250;
        $("#canvas").animate({
            width: wd,ht - 1);
        redraw();
        console.log(wd + ":" + ht);
    });
    $("#zoomout").click(function() {
        var wd = $("#canvas").width();
        var ht = $("#canvas").height();
        wd = parseInt(wd) - 250;
        ht = parseInt(ht) - 250;
        if (wd < 500) {
            return false;
        }
        $("#canvas").animate({
            width: wd,ht - 1);
        redraw();
        console.log(wd + ":" + ht);
    });
</script>

解决方法

禁用/删除您的点击处理程序.

在鼠标释放时触发click事件.
这意味着,你正在做的是,当用户释放鼠标时,你调用jQuery来进一步缩放画布.

如果删除单击处理程序,则在鼠标释放后,画布不应继续动画.

大佬总结

以上是大佬教程为你收集整理的javascript – Jquery放大和缩小工作与混蛋而不是平滑全部内容,希望文章能够帮你解决javascript – Jquery放大和缩小工作与混蛋而不是平滑所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。