jquery - Using fancybox-media with fancybox-thumbs -



jquery - Using fancybox-media with fancybox-thumbs -

i'm trying create (combined) image , youtube video gallery using fancybox while utilizing fancybox thumbs. i've run 2 problems:

when click on link video (the first link - ps, i'm not trying rick roll when click on lol), opens up, doesn't show thumbs or allow navigate through other items in group if click on link image (the sec or 3rd link), shows of thumbnails generate - including thumbnail video.... when click on thumbnail video, doesn't skip video.

thoughts?

$('.fancybox-thumbs').fancybox({ preveffect : 'none', nexteffect : 'none', closebtn : true, arrows : true, nextclick : true, helpers : { thumbs : { width : 50, height : 50 } } }); $('.fancybox-media') .attr('rel', 'media-gallery') .fancybox({ openeffect : 'none', closeeffect : 'none', preveffect : 'none', nexteffect : 'none', arrows : true, helpers : { media : {}, buttons : {} } });

here's have far: http://jsfiddle.net/6j7wxr8e/

first notice elements of fancybox gallery must share both, same selector , same rel attribute (or same data-fancybox-group attribute)

in example, selectors .fancybox-thumbs , .fancybox-media cannot belong same gallery regardless share same rel attribute. applies elements sharing same selector different rel attribute value. create sense?

so create sure elements share same selector like

<a class="fancybox"> <a class="fancybox"> <a class="fancybox">

you may not need hard-code rel attribute since initialize fancybox :

$('.fancybox').attr('rel', 'media-gallery').fancybox();

... sets same rel attribute (media-gallery) elements class fancybox.

then grouping api options in single initialization script, including fancybox helpers media, thumbs, buttons etc. like

jquery(document).ready(function ($) { $('.fancybox').attr('rel', 'media-gallery').fancybox({ preveffect: 'none', nexteffect: 'none', closebtn: true, arrows: true, nextclick: true, helpers: { thumbs: { width: 50, height: 50 }, // requires include thumbs js , css files media: {}, // requires include media js file buttons: {} // requires include buttons js , css files } }); });

see forked jsfiddle

jquery youtube fancybox thumbnails fancybox-2

Comments

Post a Comment

Popular posts from this blog

Delphi change the assembly code of a running process -

Delphi change the assembly code of a running process - i'm trying alter address 00741fa5 has push test.009e721c . alter push test.009e71c8 . procedure callback; asm force $9e71c8 end; procedure tform2.btn1click(sender: tobject); var ppid :dword; pprocess : cardinal; begin getwindowthreadprocessid(findwindow(nil,pchar('test')), @ppid); pprocess := openprocess(process_all_access, false, ppid); injectasm(pprocess, $741fa5, 10, integer(@callback), 0); end; here injectasm function (with error checking) function injectasm(process: longword; injectaddress, injectsize, codeaddress, codesize : integer): pointer; var csize, rsize : integer; replaced : array of byte; jmp : array [0..4] of byte; jmpaddress : integer; nopv : byte; : integer; nbr: ulong_ptr; begin //injectsize must equal or greater 5, because need space our //(far) jmp wwxxyyzz instruction //if there's no space, inject in place of few instructions if injectsize ...
Read more

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) - hello have problem hibernate , jackson. have 2 pojos @entity @table(name = "users") public class user implements serializable { static final long serialversionuid = 4235637833262722256l; @id @generatedvalue private int id; @column(name = "creation_date") private date creationdate; @column(name = "first_name") private string firstname; @column(name = "last_name") private string lastname; @version @column(name = "version") private int version; @column(name = "e_mail") private string email; @column(name = "enabled") private boolean enabled; @column(name = "login") private string login; @column(name = "password") private string password; @jsonmanagedreference("role") @onetomany(mappedby = "user", cascade = cascadetype.all,fetch = fetchtyp...
Read more

C++ 11 "class" keyword -

C++ 11 "class" keyword - i've started using c++ 11 little bit more , have few questions on special uses of class keyword. know it's used declare class, there's 2 instances have seen don't understand: method<class t>(); and class class_name *var; why precede typename keyword class in first example, , keyword pointer in sec example? that known elaborated type specifier , necessary when class name "shadowed" or "hidden" , need explicit. class t { }; // love of god don't t t; t t2; if compiler smart, give these warnings: main.cpp:15:5: error: must utilize 'class' tag refer type 't' in scope t t2; ^ class main.cpp:14:7: note: class 't' hidden non-type declaration of 't' here t t; ^ if class not defined, deed forwards declaration. for example: template <typename t> void method() { using type = typename t::value_type; } method...
Read more