В чем проблема при использовании fullPage. js moveTo? - PullRequest
Новая
       22

В чем проблема при использовании fullPage. js moveTo?

0 голосов
/ 14 июля 2020

Я хочу создать кнопку для перемещения определенной c страницы ... например, если я нажму #move_to_slide2, тогда страница переместится на slide2, но функция moveTo не работает.

Есть только один раздел и 4 слайда.

Как я могу перейти к кнопке? 

<div class="section" anchor="s0">
    <div class="slide" data-anchor="slide1">
        <div class="container w-1/3 mx-auto">
            <div class="my-40">
                <form method="POST" enctype="multipart/form-data">
                    {% csrf_token %}
                    <div class="text-xl font-bold text-center text-unifolio-blue">Getting Started</div>
                    <div class="flex w-full mt-5 items-center justify-center">
                        <p id="move_to_slide1">
                        <p class="w-full h-6 rounded-full bg-unifolio-blue cursor-pointer"></p>
                        </p>
                        <div class="h-px w-full bg-gray-400"></div>
                        <p id="move_to_slide2">
                        <p class="w-full h-6 rounded-full bg-gray-400 cursor-pointer"></p>
                        </p>
                        <div class="h-px w-full bg-gray-400"></div>
                        <p id="move_to_slide3">
                        <p class="w-full h-6 rounded-full bg-gray-400 cursor-pointer"></p>
                        </p>
                        <div class="h-px w-full bg-gray-400"></div>
                        <div class="flex w-full mb-5 items-center text-center justify-center">
                            <p id="move_to_slide1">
                            <p class="w-full h-6 text-xs text-unifolio-blue cursor-pointer">아이디 및 비밀번호 설정</p>
                            </p>
                            <div class="h-px w-full bg-white"></div>
                            <p id="move_to_slide2">
                            <p class="w-full h-6 text-xs text-gray-400 cursor-pointer">개인정보 입력</p>
                            </p>
                            <div class="h-px w-full bg-white"></div>
                            <p id="move_to_slide3">
                            <p class="w-full h-6 text-xs text-gray-400 cursor-pointer">핸드폰 인증</p>
                            </p>
                            <div class="h-px w-full bg-white"></div>

это мой сценарий. 

<script>
    $(document).ready(function() {
        $('#fullpage').fullpage({
            //options here
            autoScrolling:true,
            scrollHorizontally: true
        });
        $('#move_to_slide1').click(function(){
        fullpage_api.moveTo(1,slide1);
        });
        $('#move_to_slide2').click(function(){
        fullpage_api.moveTo(1,slide2);
        });
        $('#move_to_slide3').click(function(){
        fullpage_api.moveTo(1,slide3);
        });
        $('#move_to_slide4').click(function(){
        fullpage_api.moveTo(1,slide4);
        });
    });
</script>

1 Ответ

0 голосов
/ 15 июля 2020

Вы не передаете правильные параметры в moveTo. * 2-й параметр должен быть привязкой слайда строкой или индексом слайда.

Например: 

fullpage_api.moveTo(1, 1); // using slide index
fullpage_api.moveTo(1, 'slide1');  // using slide anchor
...