How-to force disable Galery mode while still using rel identical tags ?

276 views
Skip to first unread message

RavanH

unread,
Nov 26, 2010, 5:32:24 PM11/26/10
to fancybox
Hi all,

Using some links to external pages on a site that all have the
rel="external" tag, I would like to be able to open them in FancyBox
but WITHOUT linking them as a gallery and have that Prev/Next button
hovering above (and blocking interaction with) the iframe content...

I tried to use different classes like on one class="fancybox-iframe"
and the other class="fancybox iframe" (notice the space instead of
hyphen) but that does not seem to matter in any way.

Is this possible with some parameter? Or do I need to go as far as to
force-hide the Prev/Next buttons plus disabling the mousewheel
interaction?

Thanks for any tips :)

JFK

unread,
Nov 27, 2010, 3:33:14 PM11/27/10
to fancybox
set 'showNavArrows' to false

RavanH

unread,
Nov 27, 2010, 4:36:32 PM11/27/10
to fancybox
Thanks :)

But that still leaves the possibility to move to the next iframe in
the gallery by using the left/right keyboard arrow keys and (if
mousewheel action is active by default) the scroll-wheel too...

I was hoping the whole gallery mode could just be disabled for a
content type like iframe...

JFK

unread,
Nov 28, 2010, 12:34:58 AM11/28/10
to fancybox
do you require the rel attribute for anything else but fancybox?
otherwise you can get rid of it without editing your html code

$("a.fancybox").removeAttr('rel').fancybox();

that way all anchors with class fancybox open without being linked to
any gallery

RavanH

unread,
Nov 28, 2010, 3:20:04 PM11/28/10
to fancybox
Unfortunately the rel "external" attribute is added automatically for
every link that is outside the domain. Another jQuery routine then
adds a target= "_blank" to each outside link so that it opens in a new
window/tab without invalidating XHTML. I'm not for this kind of thing
(new windows/tabs should be left up to the visitor) but sadly it's the
choice of the site owner.

So yes, the rel attribute is required...

Maybe using a variant your suggestion in the onStart function would
work? Something like:

'onStart' : function(selectedArray, selectedIndex)
{ selectedArray[selectedIndex].removeAttr('rel'); }

Or would that kind of thing be better put in onComplete ?

JFK

unread,
Nov 28, 2010, 6:42:02 PM11/28/10
to fancybox
well, you didn't answer my question
one thing is that the rel attribute is required and another that is
added automatically, but you didn't say what for
anyway
$("a.fancybox").removeAttr('rel').fancybox();
still solves your issue then

RavanH

unread,
Nov 28, 2010, 7:32:59 PM11/28/10
to fancybox
Yep, you are right... it still works... ( provided the FancyBox jQuery
call runs AFTER javascript that automatically attaches the rel
attribute ! )

To answer your question "what for":
The rel attribute keyword 'external' is there for accessibility
reasons. It is one of the allowed rel keywords (while arbitrary stuff
like 'fancybox' or 'gallery' is not!) in the HTML5 specs and is meant
to indicate links that are outside the domain. Read more on
http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#linkTypes
.

Anyway, thanks :)

mygoggie

unread,
Nov 29, 2010, 3:00:11 AM11/29/10
to fanc...@googlegroups.com
I have raised this issue before and I must agree with @ravanh that it
does have implications if FancyBox and HTML5 meets.

I would suggest that you add a unique second link token to the rel=''
attribute. Add 'nofollow' and it tells Fancybox not to build a gallery.

To add use this block of code in your document.ready() block:

jQuery('a:has(img)').filter(function()
{
if (jQuery(this).attr('rel').match(/[\w]+(external)/gi))
{
jQuery(this).attr(
{
'rel': 'nofollow'
});
}
return false;
});

This is off the top of my head, so the regex might be wrong.

Should fix you up!

On 2010/11/29 02:32 AM, RavanH wrote:
> Yep, you are right... it still works... ( provided the FancyBox jQuery
> call runs AFTER javascript that automatically attaches the rel
> attribute ! )
>
> To answer your question "what for":
> The rel attribute keyword 'external' is there for accessibility
> reasons. It is one of the allowed rel keywords (while arbitrary stuff
> like 'fancybox' or 'gallery' is not!) in the HTML5 specs and is meant
> to indicate links that are outside the domain. Read more on
> http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#linkTypes

> ..

Reply all
Reply to author
Forward
0 new messages