Не получается написать функцию в javascrit. Гуру JavaScript'a help?

Question

Apxu @Apxu

JavaScript

Не получается написать функцию в javascrit. Гуру JavaScript'a help?

Необходимо вот что реализовать:
Есть переменная в коде файла.js
...
var controller = $.superscrollorama();
...
которая отвечает за работу анимации на сайте. Если ему передать значение false (var controller = false), то анимация перестает работать. Так вот, нужно сделать функцию, которая будет срабатывать при клике на пункт меню и она должна делать примерно вот что: Менять значение переменной var controller на false, после этого запускать таймер на 1.5 секунды, который будет возвращать этой же переменной( var controller) начальное значение(var controller = $.superscrollorama();)

вот мои наброски, но у меня не получается изменить значение переменной в файле.js через мою функцию..может с областью видимости что-то? Или в чем-то другом проблема...возможно такое реализовать?

function foo(){
return controller = false;
setTimeout(function(){
return controller = $.superscrollorama();
}, 1500);
});

Вопрос задан более трёх лет назад
2232 просмотра

Комментировать

Подписаться 2 Оценить Комментировать

Пригласить эксперта

Ответы на вопрос 3

1 комментарий

Apxu @Apxu Автор вопроса

Не выходит... возможно может как-то сделать так чтобы при нажатии на кнопку, этот скрипт который отвечает за анимацию деактивировался на полторы секунды? Но если кнопка нажата не была, то анимация должна работать.. вот примерно, что мне нужно. Реально это сделать? Может хоть скажите в какую сторону копать.:|

скрипт отвечающий за анимацию приведен ниже:

var controller = $.superscrollorama();

// Анимация которую нужно отключать при клике
controller.pin($('#portfolio'), 800, {
anim: (new TimelineMax())
.appendMultiple([
TweenMax.fromTo($('.item-img-box img'), 1,
{css:{top:0, opacity: 1, display: 'inline'}, immediateRender:true},
{css:{top:100, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item'), 1,
{css:{borderTopWidth: 5}, immediateRender:true},
{css:{borderTopWidth: 0}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-img-box, .portfolio-item .sep-line'), 1,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 0, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-title-box'), 4,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 100, rotation:"360deg"}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5.5,
{css:{top: 0}, immediateRender:true},
{css:{top: 123}, ease:Back.easeIn}),
TweenMax.fromTo($('#case'), 5.5,
{css:{top: 0, right: 0}, immediateRender:true},
{css:{top: 370, right: 323}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites, #games'), 5.5,
{css:{left: 0}, immediateRender:true},
{css:{left: 323}, ease:Back.easeIn}),
])
.appendMultiple([
TweenMax.fromTo($('#case'), 2,
{css:{scale: 1}, immediateRender:true},
{css:{top: 520, scale: 0.2}, ease:Back.easeIn}),
TweenMax.fromTo($('#games'), 3.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 420, scale: 0.3}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.4}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites'), 6.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.5}, ease:Back.easeIn}),
], "+=3"),

onUnpin: function(){
$('#portfolio').css("position", "relative");
}
}, 0);

Написано более трёх лет назад

1 комментарий

Apxu @Apxu Автор вопроса

Не выходит... возможно может как-то сделать так чтобы при нажатии на кнопку, этот скрипт который отвечает за анимацию деактивировался на полторы секунды? Но если кнопка нажата не была, то анимация должна работать.. вот примерно, что мне нужно. Реально это сделать? Может хоть скажите в какую сторону копать.:|

скрипт отвечающий за анимацию приведен ниже:

var controller = $.superscrollorama();

// Анимация которую нужно отключать при клике
controller.pin($('#portfolio'), 800, {
anim: (new TimelineMax())
.appendMultiple([
TweenMax.fromTo($('.item-img-box img'), 1,
{css:{top:0, opacity: 1, display: 'inline'}, immediateRender:true},
{css:{top:100, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item'), 1,
{css:{borderTopWidth: 5}, immediateRender:true},
{css:{borderTopWidth: 0}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-img-box, .portfolio-item .sep-line'), 1,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 0, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-title-box'), 4,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 100, rotation:"360deg"}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5.5,
{css:{top: 0}, immediateRender:true},
{css:{top: 123}, ease:Back.easeIn}),
TweenMax.fromTo($('#case'), 5.5,
{css:{top: 0, right: 0}, immediateRender:true},
{css:{top: 370, right: 323}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites, #games'), 5.5,
{css:{left: 0}, immediateRender:true},
{css:{left: 323}, ease:Back.easeIn}),
])
.appendMultiple([
TweenMax.fromTo($('#case'), 2,
{css:{scale: 1}, immediateRender:true},
{css:{top: 520, scale: 0.2}, ease:Back.easeIn}),
TweenMax.fromTo($('#games'), 3.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 420, scale: 0.3}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.4}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites'), 6.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.5}, ease:Back.easeIn}),
], "+=3"),

onUnpin: function(){
$('#portfolio').css("position", "relative");
}
}, 0);

Написано более трёх лет назад

1 комментарий

Apxu @Apxu Автор вопроса

Не выходит... возможно может как-то сделать так чтобы при нажатии на кнопку, этот скрипт который отвечает за анимацию деактивировался на полторы секунды? Но если кнопка нажата не была, то анимация должна работать.. вот примерно, что мне нужно. Реально это сделать? Может хоть скажите в какую сторону копать.:|

скрипт отвечающий за анимацию приведен ниже:

var controller = $.superscrollorama();

// Анимация которую нужно отключать при клике
controller.pin($('#portfolio'), 800, {
anim: (new TimelineMax())
.appendMultiple([
TweenMax.fromTo($('.item-img-box img'), 1,
{css:{top:0, opacity: 1, display: 'inline'}, immediateRender:true},
{css:{top:100, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item'), 1,
{css:{borderTopWidth: 5}, immediateRender:true},
{css:{borderTopWidth: 0}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-img-box, .portfolio-item .sep-line'), 1,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 0, opacity: 0, display: 'none'}, ease:Back.easeIn}),
TweenMax.fromTo($('.portfolio-item .item-title-box'), 4,
{css:{opacity: 1}, immediateRender:true},
{css:{height: 100, rotation:"360deg"}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5.5,
{css:{top: 0}, immediateRender:true},
{css:{top: 123}, ease:Back.easeIn}),
TweenMax.fromTo($('#case'), 5.5,
{css:{top: 0, right: 0}, immediateRender:true},
{css:{top: 370, right: 323}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites, #games'), 5.5,
{css:{left: 0}, immediateRender:true},
{css:{left: 323}, ease:Back.easeIn}),
])
.appendMultiple([
TweenMax.fromTo($('#case'), 2,
{css:{scale: 1}, immediateRender:true},
{css:{top: 520, scale: 0.2}, ease:Back.easeIn}),
TweenMax.fromTo($('#games'), 3.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 420, scale: 0.3}, ease:Back.easeIn}),
TweenMax.fromTo($('#banner'), 5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.4}, ease:Back.easeIn}),
TweenMax.fromTo($('#sites'), 6.5,
{css:{scale: 1}, immediateRender:true},
{css:{top: 534, scale: 0.5}, ease:Back.easeIn}),
], "+=3"),

onUnpin: function(){
$('#portfolio').css("position", "relative");
}
}, 0);

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

JavaScript

+1 ещё

Средний
При создании PWA ошибка Cannot read properties of null (reading 'prompt'), в чем проблема?
- 1 подписчик
- 2 часа назад
- 25 просмотров
0

ответов
JavaScript

+1 ещё

Средний
Как сделать так, чтобы клик по object передавался родителю?
- 1 подписчик
- 2 часа назад
- 75 просмотров
2

ответа
JavaScript

+1 ещё

Средний
Как сделать программную навигацию без изменения url в vue-router + vue3?
- 1 подписчик
- 13 часов назад
- 37 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как скачать pdf из встроенного просмотрщика на сайте?
- 1 подписчик
- 20 часов назад
- 127 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как построение маршрута на 2GIS API v2.0?
- 1 подписчик
- 21 час назад
- 47 просмотров
0

ответов
JavaScript

Средний
Эффект наложения блоков?
- 1 подписчик
- вчера
- 109 просмотров
2

ответа
JavaScript

+2 ещё

Средний
Как изменить содержание блока програмно со свойством contentEditable?
- 1 подписчик
- вчера
- 87 просмотров
0

ответов
JavaScript

+4 ещё

Средний
Как сделать правильное динамическое масштабирование ion-range в зависимости от ширины колонок линии со значениями?
- 1 подписчик
- вчера
- 48 просмотров
0

ответов
JavaScript

Простой
Как после сабмита очистить поле type="tel" и показать очищенную маску?
- 2 подписчика
- вчера
- 71 просмотр
0

ответов
JavaScript

+1 ещё

Простой
Почему при добавление переменно в style, она перестаёт обновляться?
- 1 подписчик
- 22 апр.
- 71 просмотр
1

ответ
Показать ещё Загружается…

JavaScript разработчик

SummerWeb • Ярославль

от 100 000 до 140 000 ₽

JavaScript разработчик

вАйТи

от 5 000 до 25 000 ₽

JavaScript Fullstack

OnClass

от 200 000 до 600 000 ₽

Разработка одностраничника

25 апр. 2024, в 11:02

5000 руб./за проект

Фронт мобильное приложение

25 апр. 2024, в 10:42

150000 руб./за проект

Настроить вёрстку webapp-telegram

25 апр. 2024, в 10:41

2000 руб./за проект

Answer 1 · 2014-10-21 11:16:05

Андрей Малиновский @GAVRAN

Если я правильно вас понял вот пример jsfiddle.net/mz6hybg5/1

Ответ написан более трёх лет назад

1 комментарий

Answer 2 · 2014-10-21 11:19:43

window.superscrolloramaController = $.superscrollorama();

function foo() {
  window.superscrolloramaController = false;
  setTimeout(function(){
    window.superscrolloramaController = $.superscrollorama();
  }, 1500);
});

но правильнее будет так:

$(function(){
  var controller = $.superscrollorama();

  $("button").on("click", function(){
    controller = false;
    setTimeout(function(){
     controller = $.superscrollorama();
    }, 1500);
  });
})

Answer 3 · 2014-10-21 11:23:35

return означает выход из функции
var означает, что вы создали новую переменную внутри этой функции
как-то так jsfiddle.net/yhq7hsg9

Не получается написать функцию в javascrit. Гуру JavaScript'a help?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт