wheelnav.js 弹跳效果

Question

正在使用 wheelnav.js 制作饼图菜单。到目前为止一切进展顺利，但就我的生活而言，我似乎没有在 wheelnav.js 文档中找到有关如何在您进行菜单选择时抑制弹跳效果的任何地方。

有关此效果的示例，请查看 http://pmg.softwaretailoring.net/ ，打开 'rotate' 开关并单击饼图菜单中的数字。选中的选项旋转到焦点（默认顶部）并弹跳到停止。

来自 http://wheelnavjs.softwaretailoring.net/examples.html 的原始示例我认为会有所帮助，因为该页面上的第一个示例有一个不会弹跳的饼图菜单，但它们混淆并缩小了底层示例 javascript文件。

如能提供任何有关在何处查找更详尽的文档或详细示例的提示或提示，我们将不胜感激。

更新：在他们的网站代码中找到了对使用 animatetime 属性的轮子对象的引用。将其设置为较低的数字（如 200）会导致轮子旋转得更快但不会反弹。这不是一个完美的解决方案，因为我可能希望旋转速度更慢，但在我了解更好的方法之前就足够了。

Answer 1

尝试使用这样的东西：

wheel = new wheelnav('wheelDiv');
wheel.animatetime = 1000;
wheel.animateeffect = 'linear';

我相信线性设置正是您正在寻找的属性。

这可以在文档this page 中找到

Answer 2

我用过wheelnav.js，也联系过他的作者解决我的问题，他对我的问题给出了正确的回答，但是你找不到合适的文档jquery，你可以如果需要，也可以向他（邮寄给他）询问你的问题

你可以使用下面的代码 indexWheel.animatetime = 2000; // 通过这个你可以设置 faster/slower 速度 强文本


        window.onload = function () {
            var values = ['1','2','3','4'];
            var percent = [51,11,30,8];            
            var tool = ["1234 (40.10%) \n Companies (9)","1234 (40.10%) \n Companies (9)","1234 (40.10%) \n Companies (9)","1234 (40.10%) \n Companies (9)"];           

        var indexWheel = new wheelnav("indexDiv");
        indexWheel.animatetime = 2000;
            indexWheel.navItemsContinuous = true;
            indexWheel.navAngle = 0;            
            indexWheel.wheelRadius = indexWheel.wheelRadius * 0.9;
            indexWheel.slicePathFunction = slicePath().PieSlice;
            indexWheel.sliceSelectedTransformFunction = sliceTransform().MoveMiddleTransform;
            indexWheel.colors = colorpalette.goldenyellow;
            indexWheel.initWheel(values);
            indexWheel.createWheel(values);
            indexWheel.setTooltips(tool);
        };

Answer 3

animateeffect 的附加信息。

有一个link for available effects on this page。按 'animate' 按钮并单击 'easing type' link。

P.S。我知道缺乏应该包含所有属性参考的深入文档。它在我的待办事项列表中，但这是一个副项目，请耐心等待。 ;) 感谢您的反馈！

wheelnav.js 弹跳效果

wheelnav.js bouncing effect

html

javascript

user-interface

wheelnav.js