Какая переменная определяет положение несфокусированных элементов в обходном плагине? - PullRequest
1 голос
/ 27 марта 2012

Я использую обходной плагин, чтобы перебрать 3 дел.Каждый div имеет ширину 794 пикселя, что делает округлый фокусирующий элемент 794, а два элемента не в фокусе шириной 315.218 пикселей, расположенные таким образом, чтобы половина каждого из них была скрыта фокусирующим div.Это все хорошо, но общая ширина дисплея должна оставаться в пределах 1000 пикселей (в идеале 980 пикселей, но я могу выдумать, если это будет необходимо.)

По сути, я хочу, чтобы не сфокусированные div были равны 3/ 4 скрыто в фокусе div, но по жизни я не могу понять, какие переменные мне нужно отредактировать, чтобы сделать это.К сожалению, это не одна из многих легко изменяемых опций, таких как z-index и minScale.я пробовал minScale, но ясно, что это не сработает.

плагин выводит этот код:

<li class="roundabout-moveable-item" style="position: absolute; left: -57px; top: 205px; width: 319.982px; height: 149.513px; opacity: 0.7; z-index: 146; font-size: 5.6px;">

мне нужно выяснить, что изменится слевапозиционирование таким образом, что оно смещено ближе к центру сцены, например:

<li class="roundabout-moveable-item" style="position: absolute; left: 5px; top: 205px; width: 319.982px; height: 149.513px; opacity: 0.7; z-index: 146; font-size: 5.6px;">

я пытался поиграть с функциями позиционирования плагина, но все, что он сделал, это сдвинул все в тандеме влевоили правильно.

любая помощь очень ценится.этот сайт будет потрясающим, как только я разберусь со всем этим jquery!

вот ссылка на мой файл .js: http://avalon.eaw.com/scripts/jquery.roundabout2.js У меня переполнение: спрятано, чтобы помочьруководить позиционированием этих не сфокусированных предметов.

Ответы [ 3 ]

1 голос
/ 26 июня 2012

У меня была та же проблема, и я подправил варианты, предложенные выше, но не испытывал радости. Я вернул эти параметры к значениям по умолчанию и настроил следующие параметры, и мне удалось установить его в моем контейнере размером 980 пикселей:

info.midStage = {
    width: info.stage.width / 2.69,
    //original value was 2.0 - changed to resize the item and move it closer to the middle
    height: info.stage.height / 2
    };

    info.nudge = {
    width: info.midStage.width + (info.stage.width * 0.18),
    //original value was 0.05 - changed to resize the item and move it closer to the middle
    height: info.midStage.height + (info.stage.height * 0.05)
    };

Надеюсь, это поможет вам или кому-либо еще в этой проблеме

1 голос
/ 21 июля 2012

Регулировка настроек ширины / высоты на перекрестке ul должна помочь.

0 голосов
/ 04 июня 2012

Я все еще не думаю, что нашел идеальное решение, но без какого-либо руководства я просто начал взламывать сценарии, менять цифры тут и там, чтобы посмотреть, что произошло. Мне удалось приблизить фланкирующие элементы к центру, изменив математику, например так:

(function($) {
    "use strict";

    var defaults, internalData, methods;

    // add default shape
    $.extend({
        roundaboutShapes: {
            def: "lazySusan",
            lazySusan: function (r, a, t) {
                return {
                    x: Math.sin(r + a), 
                    y: (Math.sin(r + 3*Math.PI/2 + a) / 8) * t, 
                    z: (Math.cos(r + a) + 1) / 2,
                    scale: (Math.sin(r + Math.PI/2 + a) / 1.5) + 0.5 // default setting a) / 2.0) changed to bring out of focus elements closer to the middle
                };
            }
        }
    });

и для регулировки наклона (который вообще не реагировал на предопределенную переменную) я изменил определенный CSS для 'top'

// update item
child
    .css({
        left: ((factors.x * info.midStage.width + info.nudge.width) - factors.width / 2.0).toFixed(0) + "px",
        top: ((factors.y * info.midStage.height + info.nudge.height) - factors.height / 1.3).toFixed(0) + "px",
        // default setting is factors.height / 2.0. changed to adjust height ratio of in focus and out of focus items
        width: factors.width + "px",
        height: factors.height + "px",
        opacity: (info.opacity.min + (info.opacity.diff * factors.scale)).toFixed(2),
        zIndex: Math.round(info.zValues.min + (info.zValues.diff * factors.z)),
        fontSize: (factors.adjustedScale * data.startFontSize).toFixed(1) + "px"
    });
    data.currentScale = factors.adjustedScale;

Надеюсь, это кому-нибудь поможет. Я знаю, что должен быть лучший способ сделать это, поэтому, если кто-то найдет ответ, пожалуйста, напишите об этом!

...