В гугле есть пара решений по запросу bxslider captions outside slider (
раз,
два).
Вкратце, сделать отдельный блок bxSlider'а для caption'ов, там где вам нужно снаружи слайдера, и использовать методы callback API слайдера (onSlideBefore, onSlideLoad).
В частности вот код, который синхронизирует блок слайдов с блоком текста из первой ссылки:
<script>
var bx = $('.bxslider').bxSlider({
auto: true,
infiniteLoop: true,
pager: false,
controls: true,
pause: 5000,
onSlideBefore: syncTextSlider
});
var cx = $("#slider-text").bxSlider({
infiniteLoop: true,
pager: false,
controls: false
});
function syncTextSlider($ele, from, to) {
cx.goToSlide(to);
}
</script>
То есть при нажатии на кнопку следующего слайда (или в целом - перед каждым слайдом) - вызывается функция syncTextSlider, в которой вызывается метод текстового слайда
goToSlide. Как написано там же ниже в комментарии, можно просто использовать метод
goToNextSlide.
Простой
