문제

while I was trying to setup an image gallery I encountered an issue when calling camera.js (here) and mobile.js (here) along with fullpage.js [(by Alvaro Trigo)]. The problem is that whenever I click on any of the hyperlinks in the top navbar, they just won't work. There's one that does though, but it redirects to another page instead of a section. It works perfectly fine without the gallery's scripts, and when imported, it all works except of the above. Can anyone help me out here?

Thanks in advanced.

Just in case, here's my navbar code:

 <ul id="menu">
        <li data-menuanchor="inicio" class="active normalmenu"><a href="#inicio">Inicio</a></li>
        <li data-menuanchor="descripcion" class="normalmenu submenuact"><a href="#quees">Qué es Rien Pipe</a>
            <div id="submenuact2">
                <ul id="submenu">   
                    <li data-menuanchor="descripcion" class="noborder"><a href="#descripcion">Descripción de Rien Pipe</a></li>
                    <li data-menuanchor="descripcion" class="noborder"><a href="#descripcion/1">La diferencia</a></li>
                    <li data-menuanchor="descripcion" class="noborder"><a href="#descripcion/2">Mecanismo</a></li>  
                </ul>
            </div>  
        </li>
        <li data-menuanchor="quienessomos" class="normalmenu"><a href="#quienessomos">Quiénes somos</a></li>
        <li data-menuanchor="preguntasfrecuentes" class="normalmenu"><a href="#preguntasfrecuentes">Preguntas frecuentes</a></li>
        <li data-menuanchor="testimonios" class="normalmenu"><a href="#testimonios">Testimonios</a></li>    
        <li data-menuanchor="contacto" class="normalmenu"><a href="#contacto">Contacto</a></li> 
        <li class="normalmenu"><a href="http://rienpipe.cloudapp.net/es/home/11-rien-pipe-primera-etapa.html">Hacer un pedido</a></li>  
    </ul>

and the gallery section:

         <div class="camera_pos">
            <div class="camera_wrap camera_azure_skin" id="camera_wrap_1">
                <div data-src="imgs/banner1.png">
                </div>
                <div data-src="imgs/banner2.png">
                </div>
                <div data-src="imgs/banner3.png">
                </div>
            </div>
        </div>
도움이 되었습니까?

해결책

It sounds like you are not initializing your other plugins inside the afterRender callback as detailed in fullpage.js documentation:

afterRender()

This callback is fired just after the structure of the page is generated. This is the callback you want to use to initialize other plugins or fire any code which requires the document to be ready (as this plugin modifies the DOM to create the resulting structure).

 $.fn.fullpage({
        afterRender: function(){
            //your plugins initialization here
            alert("The resulting DOM stucture is ready");
        }
 });
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top