Menu
I'm using fancyBox to create a gallery with the following code:
<a class="fancybox" rel="group1" href="img/work/1.jpg"></a>
<a class="fancybox" rel="group1" href="img/work/2.jpg"></a>
<a class="fancybox" rel="group1" href="img/work/3.jpg"><img src="img/th/thumb.jpg" alt="Thumb" /></a>
But I'm getting errors while validating the code. It says:
Bad value group1 for attribute rel on element a: Keyword group1 is not registered.
How do I fix this issue? Am I not writing the code out correctly? I basically wanted one thumbnail, with 3 photos to scroll through.
Thank you.
237
How do I fix this issue?
You rewrite the code so it doesn't try to describe the relationship between the current page and the image with the nonsense term "group1".
HTML 5 provides the data-* series of attributes for adding data solely for the purpose of JS. There is no need to hijack rel, which has a defined meaning.
41
If you want to have a fancybox gallery within a valid HTML document (just because we are all purists ;) then you need two things:
1: An HTML5 DOCTYPE
<!DOCTYPE html>
2: use the data-fancybox-group attribute rather than the rel attribute like:
<a class="fancybox" data-fancybox-group="group1" href="img/work/1.jpg"></a>
That validates!! ... see sample here
NOTE: this is for fancybox v2.x
111
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
