Приостановка SuperSized.js через onClick на другом элементе - PullRequest
Новая
       31

Приостановка SuperSized.js через onClick на другом элементе

0 голосов
/ 25 марта 2012

Я действительно не "получаю" jQuery - я использую JS только для изменения атрибутов DOM на стороне клиента - но когда инструмент отвечает всем требованиям, вы должны его использовать.У меня есть слайд-шоу SuperSized, запущенное на моей странице, и я добавил пару кнопок на панель навигации внизу.Когда нажимаются эти кнопки, я открываю окно, показывающее больше информации о текущем слайде, но, поскольку это «текущий» слайд, мне нужно остановить показ, когда окно открыто.Все работает хорошо, за исключением этого остановки бизнеса.Я ссылался на API, и есть вызов, который делает именно это: 

$(element).click(function(){
    api.playToggle();
});

... но как я могу вызвать это в onClick на другом элементе?Я получаю, что приведенный выше код добавляет обработчик события click к элементу, я просто не понимаю, как я сам вызываю эту функцию из простого старого onClick = "" ...

Любая помощь очень ценится

Дэнни

Ответы [ 2 ]

0 голосов
/ 18 июля 2012

Я использую этот код, который вы предложили: 

<script type="text/javascript">


$(function($) {
    $('#slideInfo').click(function() {
        api.playToggle();
    });
});

</script>


<div id="btnContainer">
    <a id="slideInfo" href="#">More Info</a>
</div>

Чтобы приостановить слайд-шоу, используя модальное окно.Это работает отлично!

Однако, когда я закрываю модальное окно, я не могу перезапустить слайд-шоу.

Я пропустил какой-то дополнительный код?(Вы написали предыдущему пользователю, чтобы спросить вас, так ли это).

Большое спасибо! T

0 голосов
/ 17 мая 2012

Вам необходимо прикрепить событие click к элементу.

http://api.jquery.com/click/

Я предполагаю, что ваша "кнопка" является ссылкой.

HTML: 

<div id="btnContainer">
    <a id="slideInfo" href="#">More Info</a>
</div>

JQuery: 

$(function($) {
    $('#slideInfo').click(function() {
        api.playToggle();
    });
});

Вот что это делает. Во-первых, jQuery должен запускаться после завершения загрузки страницы. Это делается с помощью: 

$(function($) {
    //Do this when page/DOM is done loading
});

Мы используем jQuery Selectors , чтобы выбрать элемент с идентификатором slideInfo. Мы прикрепляем обработчик события click к элементу. Внутри обработчика клика мы определяем, какой код мы хотим выполнить после нажатия на элемент. В этом случае мы хотим переключить воспроизведение слайд-шоу. Вызов api.PlayToggle (); функция расширенного плагина сделает это.

Следует помнить, что это приостановит показ слайдов, и вы сможете отобразить окно с дополнительной информацией. Я не знаю, как вы отображаете это окно, но я предлагаю использовать всплывающее окно диалога. Когда пользователь закрывает это диалоговое окно, вам нужно как-то снова вызвать функцию api.playToggle (), чтобы снова запустить слайд-шоу. Если вам нужна дополнительная помощь, просто ответьте с дополнительной информацией.

Я не совсем уверен, какой у вас второй вопрос. Я думаю, что вам нужна функция, которая вызывается при нажатии кнопки, которая запускает функцию api.playToggle (), но вы также хотите вызывать эту функцию в другом месте в другом коде javascript / jquery или присоединить ее к другому элементу. В этом случае вы можете подумать об изменении вашего jquery на это: 

<script type="text/css">
    function ToggleSlideshow() {
        api.playToggle();
    }

    $(function($) {
        $('#slideInfo').click(function() {
            ToggleSlideshow();
        });
    });
</script>

Я просто создал функцию с именем ToggleSlideshow (), которая будет запускать функцию api.playToggle (). Затем, когда я присоединяю свою функцию обработчика кликов, я говорю ей, чтобы она запускала функцию ToggleSlideshow (). Если вы хотите прикрепить это к свойству onClick кнопки или чего-то подобного, все, что вам нужно сделать, это: 

onClick="javascript:ToggleSlideShow()"

Надеюсь, я точно ответил на ваш вопрос.

...