Fancybox thumbs position

[npofopr]

Привет.

Можно ли как то поместить "превьюшки" внутрь контейнера, чтобы основная картинка и превьюшки были одним целым, а не болтались где то в самом низу.

http://jsfiddle.net/npofopr/x7YqF/

 

Например вот так:

 

 

И как можно к заголовку добавить еще строчку с Кодом?

 

Или проще не мучаться с fancybox, а поставить какое нибудь модальное окно, и внутри него повторять слайдер, который снаружи.

Нашел конечно вот такой способ http://stackoverflow.com/questions/19664688/fancybox-2-put-thumbnails-within-a-parent-div , но что то не получается прикрутить

[Zverushka]

Вообще не вижу проблемы - слайдер внутри фенсибокса и все.

[npofopr]

Вообще не вижу проблемы - слайдер внутри фенсибокса и все.

Ну это вы не видите проблемы) 

Я бы не спрашивал, если бы не видел ведь.

Может примеры есть?

[Zverushka]

@npofopr,а что именно вызывает затруднение?

.modal>#slider-1 

modal - Это фенсибокс - #slider-1 - это сам слайдер. Правда его нужно динамически создавать после открытия fancybox окна.

Edited May 4, 2014 by Zverushka

[npofopr]

@npofopr,а что именно вызывает затруднение?

.modal>#slider-1 

modal - Это фенсибокс - #slider-1 - это сам слайдер. Правда его нужно динамически создавать после открытия fancybox окна.

Затруднение вызывает не знание js, иначе бы я в другой раздел писал) 

И почему то мне кажется, что это не совсем верный путь, хотя фенсибокс весьма универсальный.

[Zverushka]

Вот я залила свой старый сайтик, там не совсем то, что нужно, но принцип похож. На самом сайте есть список превьюшек для слайдера - по клику на них открывается модальное окно, уже установленное на нужном слайде. И само модальное окно представляет из себя обычный слайдер. Добавить внутри модального окна thumbs или снаружи нет разницы. 

http://html2css.ru/pilesos/ - 

afterShow: function(){				// var sliderTextHeight = 0;				if (!si || !st) {					$(".catalog-slider .catalog-text li").show();									st = $(".catalog-slider .bx-slider.catalog-text").bxSlider({						mode: 'fade',						pager: false,						controls: false,						adaptiveHeight: true,					});					si = $(".catalog-slider .bx-slider.catalog-images").bxSlider({						mode: 'fade',						pager: false,						nextSelector: ".catalog-slider .bx-next",						prevSelector: ".catalog-slider .bx-prev",						onSlidePrev: function(){							st.goToPrevSlide();						},						onSlideNext: function(){							st.goToNextSlide();						}					});				}			}

Нужно добавить после запуска фенсибокс функцию - проверить создан или нет слайдер (si, st у меня - сори за тупые названия, фз почему такие дала), если не создан слайдер - тут же создаем.

Edited May 4, 2014 by Zverushka

[npofopr]

А как сделать, чтобы при закрытии окна, слайдер не удалялся с страницы?)

http://jsfiddle.net/npofopr/x7YqF/7/

 

И не понимаю, почему он не открывается при клике на картинку, если делать. По ссылке открывается, а по картинке нет.