标签: easing

我希望获得与网站http://www.wpnukes.com/demo/html/welcare/相同的效果

请注意登录链接旁边的屏幕右上角的联系链接,当你点击联系一个div下拉与混蛋,我怎么能达到这个效果或一些请告诉我这个效果的名称,所以我可以谷歌它,可以找到一个代码.拜托,谢谢.

在jquery.easing插件中有许多像这样的方法:

easeInOutQuint: function (x, t, b, c, d) {
    if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
    return c/2*((t-=2)*t*t*t*t + 2) + b;
}

(t/=d/2) 正在严厉惹恼jshint!

Linting assets/js/_main.js ...ERROR
[L119:C13] E030: Expected an identifier and instead saw '='.
    if ( (t/=d/2) < 1) {
[L119:C14] E020: Expected ')' to match '(' from line 119 and instead saw 'd'.
[L119:C19] W116: Expected '{' and instead saw '<'.
[L119:C19] E030: Expected an identifier and instead saw '<'.
[L119:C19] W030: Expected …

我尝试向元素添加keySplines, values, keyTimes属性animate来模拟缓动动画。缓和效果不起作用。

提琴手

HTML

<svg xmlns="http://www.w3.org/2000/svg" id="arrow-slider-1" viewBox="0 0 766 22" width="766" height="22" fill="black" stroke="black">
   <path d="M765 22 765 15 L39 15 L25 0 L11 15 L0.5 15 L0.5 21.5 Z">
      <animate class="triangle-animation" attributeType="XML" attributeName="d" from="M765 22 765 15 L39 15 L25 0 L11 15 L0.5 15 L0.5 21.5 Z" to="M765,22L765,15L505.00002429484215,15L490.00002429484215,0L475.00002429484215,15L0.5,15L0.5,21.5" dur="4s" repeatCount="1" fill="freeze" keySplines=" 0.1 0.8 0.2 1; 0.1 0.8 0.2 1; 0.1 0.8 0.2 1; 0.1 0.8 0.2 1; 0.1 0.8 …

我正在使用jQuery插件进行自定义Easing(jQuery Easing v1.3 -http://gsgd.co.uk/sandbox/jquery/easing/),为我的jQuery Tools可滚动实例添加自定义缓动,如下所示:

$(".historyScrollable").scrollable({ easing:"easeInOutCubic"}).navigator();

我希望也能使用jQuery Easing插件与.animate函数一起使用

我试过像这样使用它:

$(this).find('div').stop().animate({'marginLeft':'-280px'},200,easeInOutCubic);

但它说没有定义"easeInOutCubic".我正在做的是什么,而我的语法错了？我也试过使用specialEasing,但似乎也没有用:

$(this).find('div').stop().animate({'marginLeft':'-280px'},{duration:200, customEasing:{'marginLeft':'easeInOutCubic'}});

我找了这个,但我发现如何将它与ScrollTo一起使用.这个是不同的.

我需要让jQuery Easing Plugin使用这个函数:

function ira(id){
      $('html,body').animate({scrollTop: $("#"+id).offset().top}, 700);
}

没有更多的解释...提前感谢您的帮助!

...

此外,我想知道是否可以设置速度而不是动画的持续时间,因此如果我离目标很近或者如果我远离它,则需要更少.

再次感谢!

我正在将一个Flash网站转换为js,并且还有很多内容:

持续运行动态背景,在jquery上运行.网站通过ajax API调用数百张图片.将鼠标悬停在图像上,调用更多ajax以获取更大的版本并将其显示为叠加层,并具有良好的动画序列.许多鼠标定位要求确定鼠标是否仍然覆盖覆盖图像.

但即使有宽松,一些动画也会变得越来越激动.这是用js停止的吗？

我想以某种减速方式将精灵从点y1动画到点y2.当它到达点y2时,物体的速度将为0,因此它将完全停止.

我知道这两点,我知道对象的起始速度.动画时间对我来说并不那么重要.如果需要,我可以决定.

例如:y1 = 0,y2 = 400,v0 = 250每秒像素(=起始速度)

我读到了关于缓动函数但我不明白如何在更新循环中实际实现它.这是我的更新循环代码,应该以某种方式实现缓动函数.

-(void)onTimerTick{
   double currentTime =  CFAbsoluteTimeGetCurrent() ;
   float timeDelta = self.lastUpdateTime - currentTime;
   self.lastUpdateTime = currentTime;

   float *pixelsToMove = ???? // here needs to be some formula using v0, timeDelta, y2, y1

   sprite.y +=  pixelsToMove;
}

对于学校作业,我们必须在Javascript中制作图表.老师想看一些动画图.所以我在一周内建立了关于我的推文的图表,但是找不到如何在两个y坐标之间缓和.

您可以在jsfiddle或本网站上找到我的项目.

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var form = document.getElementById("form");
var data = [];
var huidigeYpos = [];
var nieuweYpos = [];
var count = [];
var snelheid = 0;

function init(){
    ctx.fillStyle="rgb(255,255,255)";
    ctx.fillRect(0,0,canvas.width,canvas.height);
    ctx.translate(0, 445);

    for(var i = 0; i < 7; i++){
        data[i] = form[i].value*30;
    }

    draw();
}

function draw(){
    ctx.fillStyle="rgb(255,255,255)";
    ctx.fillRect(0,0,canvas.width,-canvas.height);
    ctx.beginPath();    
    ctx.moveTo(0,0);
    for(var i = 0; i <= 750; i += 125){
        ctx.lineTo(i,-data[i/125]);
        huidigeYpos.push((data[i/125]));
    }
    if(huidigeYpos.length > …

我从这里抓住了这个紧凑的新闻阅读器下面是点击链接时动画放松和简化预览的代码.我将整个页面的尺寸从300的高度更改为600.我做了一些谷歌搜索,jquery的动画部分动画了元素的CSS属性.所以我从那里开始工作.以为我有事情可行,但事实并非如此,我想我会再次从头开始.

任何人都可以解读这个吗？例如,我只是猜测,"动画页面元素的顶级css到-300px ...我不明白的其余部分.

感谢您提供任何帮助,骚扰或指示.

$current.stop().animate({'top':'-300px'},600,'easeOutBack',function(){
                            $(this).css({'top':'310px'});

sdfadssf

            $items.each(function(i){
                var $item = $(this);
                $item.data('idx',i+1);

                $item.bind('click',function(){
                    var $this       = $(this);
                    $cn_list.find('.selected').removeClass('selected');
                    $this.addClass('selected');
                    var idx         = $(this).data('idx');
                    var $current    = $cn_preview.find('.cn_content:nth-child('+current+')');
                    var $next       = $cn_preview.find('.cn_content:nth-child('+idx+')');

                    if(idx > current){
                        $current.stop().animate({'top':'-300px'},600,'easeOutBack',function(){
                            $(this).css({'top':'310px'});
                        });
                        $next.css({'top':'310px'}).stop().animate({'top':'5px'},600,'easeOutBack');
                    }
                    else if(idx < current){
                        $current.stop().animate({'top':'310px'},600,'easeOutBack',function(){
                            $(this).css({'top':'310px'});
                        });
                        $next.css({'top':'-300px'}).stop().animate({'top':'5px'},600,'easeOutBack');
                    }
                    current = idx;
                });
            });

每次在slideToggle()函数的缓动动画中发生修改时,有没有办法在javascript上执行已定义的函数？

例:

SlideToggle("1000", "linear", functiontoexecute())

我想functiontoexecute()执行它在"线性"缓动中发生的每一步.

我已经查看了.slideToggle()的 JQuery网页,并尝试使用"进度"或"步骤"选项......但要么它们没有按预期执行,要么我没有正确使用它们......

有关更多详细信息,我使用的是JQuery 1.9.1

I\xc2\xb4m 尝试在拖动相机时进行缓动或惯性，以便当我放下相机时它会缓动到位。我想根据我抛出/拖动相机的力来移动相机。

这是 i\xc2\xb4m 用于拖动相机的实际代码，但其中没有平滑的缓动。

    using UnityEngine;\n    using System.Collections;\n\n    public class swipeCamera: MonoBehaviour\n    {\n        Vector3 hit_position = Vector3.zero;\n        Vector3 current_position = Vector3.zero;\n        Vector3 camera_position = Vector3.zero;\n        float z = 0.0f;\n\n        // Use this for initialization\n        void Start()\n        {\n        }\n\n        void Update()\n        {\n            if (Input.GetMouseButtonDown(0))\n            {\n                hit_position = Input.mousePosition;\n                camera_position = transform.position;\n\n            }\n            if (Input.GetMouseButton(0))\n            {\n                current_position = Input.mousePosition;\n                LeftMouseDrag();\n            }\n        }\n\n        void LeftMouseDrag()\n        {\n            // From the Unity3D docs: "The z position is in world units from the …