Jquery Scrollable не может остановить автозапуск, когда нажата навигация - PullRequest
Новая
       27

Jquery Scrollable не может остановить автозапуск, когда нажата навигация

0 голосов
/ 26 октября 2011

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

Я хочу, чтобы он прекратился, когда я нажму на любую из навигационных ссылок. Я не могу заставить прокрутку остановиться!

Вот код, который его запускает:

HTML: 

    <div id="flowpanes"> 
        <div class="items">
            <div>
                <h1>Content 1</h1>
            </div>
            <div>
                <h2>Content 2</h2>
            </div>
            <div>
                <h2>Content 3</h2>
            </div>
            <div>
                <h2>Content 4</h2>
            </div>
        </div>
    </div>
    <ul id="flowtabs" class="navi">
        <li><a href="#one" class="current"></a></li>
        <li><a href="#two"></a></li>
        <li><a href="#three"></a></li>
        <li><a href="#four"></a></li>
    </ul>

Jquery, который его активирует: 

$(document).ready(function() {
    $("#flowpanes").scrollable({ circular: true, mousewheel: true }).autoscroll({autoplay: true,interval: 5000,steps: 1}).navigator({
        navi: ".navi",
        naviItem: 'a',
        activeClass: 'current',
        history: false,
    })
});

Я попробовал это, но это не сработало: 

$(".navi a").click (function(){
    api.stop()
});

Затем я попытался добавить js к фактическим кнопкам, но я не думаю, что я правильно его задаю - нужно ли что-то вроде приведенного ниже кода, нужно что-то еще, чтобы точно указать прокручиваемую область - прокручиваемый контент находится в отдельном элементе div выше ул.нави: 

 <ul id="flowtabs" class="navi">
   <li><a href="#one" class="current" onclick="api.stop()"></a></li>
   <li><a href="#two" onclick="api.stop()"></a></li>
   <li><a href="#three" onclick="api.stop()"></a></li>
   <li><a href="#four" onclick="api.stop()"></a></li>
 </ul>

Я также попытался добавить clickable: false в раздел навигатора под историей: false, но это тоже не сработало.

Может кто-нибудь помочь?

1 Ответ

0 голосов
/ 26 октября 2011

Если вы посмотрите исходный код примера скроллера пользовательского интерфейса jquery на jQuery Scrollable , они используют эту инструкцию для назначения объекта api текущему окну: 

// provide scrollable API for the action buttons
window.api = root.data("scrollable");

ты пробовал это?

...