2016-09-09 2 views
0

Ich arbeite mit der Funktion fancybox. es funktioniert gut, aber es gruppiert nicht basierend auf meinem Rel.Gruppierung Fancybox Bild

Hier ist die JavaScipt

<script type="text/javascript"> 
    $(function($){ 
     var addToAll = false; 
     var gallery = true; 
     var titlePosition = 'inside'; 
     $(addToAll ? 'img' : 'img.fancybox').each(function(){ 
      var $this = $(this); 
      var title = $this.attr('title'); 
      var src = $this.attr('data-big') || $this.attr('src'); 
      var a = $('<a href="#" class="fancybox"></a>').attr('href', src).attr('title', title); 
      $this.wrap(a); 
     }); 
     if (gallery) 

     $('a.fancybox').fancybox({ 
      titlePosition: titlePosition 
     }); 
    }); 
    $.noConflict(); 
</script> 

HTML

<img class="fancybox" title="Bed" rel="1roomGD" src="images_1" alt="Bed" /> 
<img class="fancybox" title="K" rel="1roomGD" src="images_2" alt="K" /> 
<img class="fancybox" title="G" rel="2roomS" src="images_3" alt="G" /> 
+0

Antwort

0

wie @JFK vorgeschlagen, i Lösung weniger Code modifizieren herausgefunden, ist das Hinzufügen von .attr ('rel') von dem Wert zu greifen

img
<script type="text/javascript"> 
    $(function($){ 
     var addToAll = false; 
     var gallery = true; 
     var titlePosition = 'inside'; 
     $(addToAll ? 'img' : 'img.fancybox').each(function(){ 
      var $this = $(this); 
      var title = $this.attr('title'); 
      var src = $this.attr('data-big') || $this.attr('src'); 
      var rel = $this.attr('rel') 
      var a = $('<a href="#" class="fancybox"></a>').attr('href', src).attr('title', title).attr('rel',rel); 
      $this.wrap(a); 
     }); 
     if (gallery) 

     $('a.fancybox').fancybox({ 
      titlePosition: titlePosition 
     }); 
    }); 
    $.noConflict(); 
</script> 
+0

überprüfen Für weniger Unordnung in 'each()' check http://jsfiddle.net/p9ubpo5t/;) – JFK