Enable/Disable fancybox

218 views
Skip to first unread message

N.Nikolov

unread,
Jan 22, 2011, 11:26:06 AM1/22/11
to fancybox
Hello,

I'm making a small Chrome extension, that will add fancybox to every
page, where the user wants it( it's not a site or two, that have
galleries with anchors with the target="_blank" attribute, instead of
using fancybox or anything else, to make it more user-friendly ).
So I'm trying to do the following :

-- When the user clicks on a button, all anchors linked to images will
open with fancybox
-- When the user clicks the button again, all anchors should work as
they would before the previous step( ie, they shouldn't open in
fancybox )

What I'm doing at the moment is the following:

When the button is clicked:

-- If the button is clicked for the first time(or 3-rd, 5-th etc...)
all the correct anchors get the "FancyBox" class. Then comes the
statement $('.FancyBox').fancybox(); initializing the fancybox on
these anchors.
-- If the button is clicked for a second time, I remove the FancyBox
class on all anchors that got it in the previous step... That's where
I was expecting that they would act in the same way they did before
that, but I was wrong ^^ ( most likely it's my wrong expectation, due
to my limited knowledge on jQuery and fancybox )...

The only topic I found, that was close to that was
http://groups.google.com/group/fancybox/browse_thread/thread/94331bfa2e8c022e/1626b415c28004d9

Any suggestions will be appreciated :)

N.Nikolov

unread,
Jan 25, 2011, 4:26:58 PM1/25/11
to fancybox
Well, nobody answered, but an answer was found after all! :D

Here is the code that I'm using in case somebody else needs something
similar:

$(window).load(function(){
var counter = 0;
var activated = false;
$('#FBController').click(function () {
counter ++;
// perhaps there is a better way of checking whether it is activated
or no, but anyway :)
if ( counter % 2 == 1 ) {
activated = true;
$('#FBController').toggleClass('active');
} else {
$('#FBController').toggleClass('active');
activated = false;
}
if ( activated == true) {
// add the click listener, that will load the fancybox
$("a[href$=.jpg],a[href$=.png],a[href$=.gif]").click(function(){
$.fancybox({
'href': $(this).attr('href'),
'title': $(this).attr('title')
});
return false;
});
} else {
// remove the click listener, so links behave as they did before
$("a[href$=.jpg],a[href$=.png],a[href$=.gif]").unbind('click');
}
});
})

Pretty much it was that simple... I'll be now thinking of a way to
make a gallery, instead of opening a single image
> The only topic I found, that was close to that washttp://groups.google.com/group/fancybox/browse_thread/thread/94331bfa...
Reply all
Reply to author
Forward
0 new messages