Multiple values in rel attribute doesn't work
I've got the following code (from this tutorial:
http://www.webstuffshare.com/2010/05/filter-image-view-using-jquery/ ):
- thisItem = $(this).attr('rel');
- if(thisItem != "all") {
- $('.item li[rel='+thisItem+']').stop()
- .animate({
- 'opacity' : 1
- });
- $('.pf_item li[rel!='+thisItem+']').stop()
- .animate({
- 'opacity' : 0
- });
- } else {
- $('.item li').stop()
- .animate({
- 'opacity' : 1,
- });
- }
- })
-
- $('.item li img').animate({'opacity' : 0.5}).hover(function() {
- $(this).animate({'opacity' : 1});
- }, function() {
- $(this).animate({'opacity' : 0.5});
- });
- });
then I create HTML for navigation:
- <ul class="nav">
- <li><a href="#" rel="abc">abc</a></li>
- <li><a href="#" rel="abc2">abc2</a></li>
- </ul>
and finally HTML for elements to appear and disappear:
- <ul class="item">
- <li rel="abc">Some content here</li>
- <li rel="abc abc2">Some content here</li>
- </ul>
and it works perfect but only when I use single category for rel="". In this case rel="abc" works and rel="abc abc2" doesn't work.
There must be something with $('.pf_item li[rel!='+thisItem+']') but since I don't know jQuery I can't solve it myself. I just want to change this line into something that is able to work with multiple attributes in rel.
It would be great if anyone could help me with that!