Простая навигация по jquery

Question

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

см образец изображение ....

СЧА бары будут стрелки в нижней части. Если вы дойдете до конца, поверните стрелку на белый или, если вы начнете, сделайте левую стрелку белой.

Любая помощь будет оценена

Answer 1

Ваше решение JQuery будет зависеть от того, как вы хотите, навигация работать. Вы хотите заменить текст? Вы хотите прокручивать элементы? Здесь не так много работы ...

Но, чтобы вы начали здесь, это способ «утиной ленты» сделать это ... (Примечание: это не очень "начало работы" способ сделать это, поэтому планируйте исследование лучших решений по линии.)

var current = '1'; 
$('.navR').click(function (e) { //When user clicks on the Right nav button... 
    if (current == '1') { // If you are going to the first bit of new content... 
     $('#content').replaceWith("<div id='content'>Your First Content Here...</div>"); //Replace the content with... 
     current++; 
      $('.navR').css('color','red'); // Make the Right arrow red when more content is left 

    } else if (current == '2'){ // If you are going to the second bit of new content .... 
     $('#content').replaceWith("<div id='content'>Your Second Content Here...</div>"); // Replace the content with.... 
     current++; 
      $('.navR').css('color','white'); // Turn arrow White on last item 
    }; 

}); 

И затем переверните его влево.

$('.navL').click(function (e) { 
    if (current == '2') { 
     $('#content').replaceWith("<div id='content'>Your First Content Here...</div>"); 
     current--; 
      $('.navL').css('color','red'); 

    } else if (current == '1'){ 
     $('#content').replaceWith("<div id='content'>Your Second Content Here...</div>"); 
     current--; 
      $('.navL').css('color','white'); 
    }; 

}); 

Опять же, это больно простой и неуклюжий способ сделать это, но, возможно, это поможет вам начать работу ...