4338 posts ThemeForest Reviewer
  • Has referred 1+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Member of the Envato Team
+12 more
Ivor Envato team says

Hey see the snippet below , I need to grab the rel attribute via jQuery and generate a list of links to generate my thumbnails dynamically and append those thumbs to a div. Any idea?

<div id="fullSlider">    
<ul>
<li><a href="img/slides/1.jpg" title="Some Title" class="slide" rel="img/slides/thumb/1.jpg">1</a> </li>
<li><a href="img/slides/2.jpg" title="Some Title" class="slide" rel="img/slides/thumb/2.jpg">2</a> </li>
<li><a href="img/slides/3.jpg" title="Some Title" class="slide" rel="img/slides/thumb/1.jpg">2</a> </li>
<li><a href="img/slides/4.jpg" title="Some Title" class="slide" rel="img/slides/thumb/1.jpg">3</a> </li>
</ul>
</div>

[So I can have something like this]

<div id="showthumbs">
<li><img src="thumb-1.jpg" alt="" /></li>
<li><img src="thumb-2.jpg" alt="" /></li>
<li><img src="thumb-3.jpg" alt="" /></li>
<li><img src="thumb-4.jpg" alt="" /></li>
</div>
1012 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+6 more
wizylabs says

can you give out an example of how do you want the code to look like? im lil confused :D

4338 posts ThemeForest Reviewer
  • Has referred 1+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Member of the Envato Team
+12 more
Ivor Envato team says

Done! :)

3448 posts
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $750,000+ on Envato Market
  • Located in United States
  • Helps us moderate the forums
+10 more
sevenspark Moderator says

Well, you can grab the rel attribute using attr('rel'), so you could do something like this:

var $thumbs = $('<div id="showthumbs"></div>');

$('#fullslider ul li a').each(function(k, el){
  var $li = $('<li></li>');
  var src = $(this).attr('rel');
  $li.append( $('<img />').attr('src', src) );
  $thumbs.append($li);
});

But I’m not sure how you want to do the translation from slide rel to thumb src.

by
by
by
by
by
by