0

我最近下载了一个 JavaScript 插件(在这里找到:http ://www.jacksasylum.eu/ContentFlow/download.php ),我正在尝试对其进行一些更改。到目前为止,我对代码所做的所有编辑都是通过阅读该站点上文档选项卡下的演练完成的。我已经搜索和搜索,我只能找到一段我认为可能是我需要更改的代码。我只是没有足够的 JavaScript 知识来做这件事。

如果您之前已经下载过该插件,或者您阅读了一些文档选项卡,那么这里是正在发生的事情的图片。

在此处输入图像描述

图标分散得太远了。(忽略图标,我只使用 Facebook 和 Twitter,因为它们很简单。)我需要它们更接近。(它们分布在 960px 宽的 div 上!)

我发现这段代码可能是我正在寻找的。它被称为 StepWidth。我不知道这是否是我需要的。谁能给我填?

calcStepWidth: function(diff) {
        var vI = this.conf.visibleItems;
        var items = this.items.length;
        items = items == 0 ? 1 : items;
        if (Math.abs(diff) > vI) {
            if (diff > 0) {
                var stepwidth = diff - vI;
            } else {
                var stepwidth = diff + vI;
            }
        } else if (vI >= this.items.length) {
            var stepwidth = diff / items;
        } else {
            var stepwidth = diff * ( vI / items);
            //var stepwidth = diff/absDiff * Math.max(diff * diff,Math.min(absDiff,0.3)) * ( vI / this.items.length);
            //var stepwidth = this.flowSpeedFactor * diff / this.visibleItems;
            //var stepwidth = this.flowSpeedFactor * diff * ( this.visibleItems / this.items.length)
            //var stepwidth = this.flowSpeedFactor * diff / this._millisecondsPerStep * 2; // const. speed
        }
        return stepwidth;

如果您有插件,这可能会更容易,但任何知识都会有所帮助。

4

2 回答 2

2

首先,这不是一个 JQuery 插件。您的问题在于图像的大小和 contentFlow 容器的宽度。小图标展开以填充 960px 容器。您需要增加图像的大小和/或减少内容流的包含 div 的宽度。您可以使用 px 或 %。例如,在 contentflow 网站上,您可以看到主页右侧的图库有一个 div width:70%;。

于 2013-02-20T20:20:59.633 回答
0

首先安装ContentFlowAddOn_DEFAULT.js,然后搜索“ calcCoordinates: function (item) ”你会发现:


calcCoordinates: function (item) {
            var rP = item.relativePosition;
            //var rPN = item.relativePositionNormed;
            var vI = this.conf.visibleItems; 

            var f = 1 - 1/Math.exp( Math.abs(rP)*0.75);
            var x =  item.side * vI/(vI+1)* f; 
            var y = 1;

            return {x: x, y: y};
        },

尝试将值最小化 0.75(即 0.3)或更小,直到达到您正在寻找的正确距离

于 2016-04-27T08:15:09.710 回答