2016-12-28 2 views
-1

Я использую Bootstrap Carousel в качестве заголовка веб-сайта на PHP, есть ли способ сохранить память слайда, достигнутого при изменении страницы моего веб-сайта? Поэтому на следующей странице он начнется со следующего слайда, а не с самого начала.Как не сбрасывать слайды карусели Bootstrap

Не стесняйтесь спрашивать меня о деталях, я только что поместил стандартный код карусели на каждую страницу вверху (включая один файл PHP).

Update1: Спасибо за ответ. Я создал сеанс, чтобы сохранить слайд, на котором должна начинаться карусель. Теперь вопрос: как я могу получить текущий номер слайда? (потому что карусель цикла через х секунд, и мне нужно получить последний слайд показал).

Решено: @Andrea Ajek благодарит вас за ответ! Он также решил мой вопрос, не используя PHP-сессии!

+1

Это довольно расплывчатый вопрос, и вы можете получить downvoted по этой причине, только так вы знаете. Вернемся к теме, вы можете сделать это, установив последний просмотренный слайд в сеансе пользователя, в cookie или локальном хранилище. Затем выберите, где вы остановились, проверив это значение на другой странице. –

+1

помещает прослушиватель событий на событие 'slid.bs.carousel' и сохраняет последний номер слайда в файле cookie – Mojtaba

+1

. Правильный способ сделать это - НЕ перезагружать часть заголовка вашей страницы и просто заменять содержимое страницы, используя асинхронные вызовы, также обновляя адрес, используя 'pushstate'. Если вы сделаете это любым другим способом, слайдер будет перезагружен, повторно отображен и повторно инициализирован, в конце концов, начиная с слайда, который был включен при навигации. Самый простой способ - использовать хранилище $ _SESSION для запоминания текущего слайда при каждом изменении. Когда вы перейдете на новую страницу, проверьте, какой слайд вы были включены, и 'init()' от этого. –

ответ

1

Вы можете использовать HTML5 WebStorage для сохранения последнего индекса слайдов. Предполагая, что ваш карусельного имеет атрибут идентификатор равен «myCarousel», этот код должен работать безотказно:

$('#myCarousel').on('slid.bs.carousel', function() { 
    var currentSlide = $('#myCarousel div.active').index(); 
    sessionStorage.setItem('lastSlide', currentSlide); 
}); 

событие «slid.bs.carousel» происходит, когда карусель закончил скольжение от одного элемента к другому. Для того, чтобы проверить, есть ли индекс слайда хранится в sessionStorage и инициализировать правильно карусель, вы можете использовать следующий код:

if(sessionStorage.lastSlide){ 
     $("#myCarousel").carousel(sessionStorage.lastSlide*1); 
} 
Смежные вопросы