Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
How to display one thumbnail and show several images in slide?
I’ve setup a lightbox slide (fancyBox) … and it’s working … :)
But now I only want one thumbnail to click on … showing me the same slide.
I suspect that there are several ways to accomplish this. One could be to hide (css) all thumbnails except one. But how to code the HTML?
The tag I’m using (with smd_thumbnails and smd_macro):
<txp:images id="{img_id}" category="{cat}" wraptag="ul" break="li" class="lightbox">
<a href="<txp:image_url />" class="fancybox" rel="group">
<txp:smd_thumbnail type="{style}" />
</a>
</txp:images>Can somebody give me a hand?
Last edited by RedFox (2012-11-20 10:28:36)
Offline
Re: How to display one thumbnail and show several images in slide?
You could try
<style>
ul.lightbox>li {display:none}
ul.lightbox>li:first-child {display:inherit}
</style>Offline
Re: How to display one thumbnail and show several images in slide?
Oleg … it’s so bloody simple … *sigh … thank you so much … :)
Last edited by RedFox (2012-11-20 20:39:20)
Offline
Re: How to display one thumbnail and show several images in slide?
Joop, I’m glad it helps, but it’s pity to waist time in downloading thumbnails that are hidden anyway. Probably, you can instruct your smd_macro to output <txp:smd_thumbnail type="{style}" /> only once? If not, you could pass the resulting ul through etc_query to remove unnecessary stuff.
Offline
Re: How to display one thumbnail and show several images in slide?
As far as I know you can’t instruct smd_macro to output one image. And how to do things with etc_query … !? … I’m a non-coder.
Last edited by RedFox (2012-11-20 11:21:02)
Offline
Re: How to display one thumbnail and show several images in slide?
Sorry, that was a bad idea for non-js browsers. Probably you’d better replace css with a jQuery snippet (not tested):
<script type="text/javascript">
$(function () {
$("ul.lightbox>li:not(:first-child)").css("display","none");
});
</script>Offline
Re: How to display one thumbnail and show several images in slide?
It works … but why should I use this snippet instead of common CSS?
Offline
Re: How to display one thumbnail and show several images in slide?
RedFox wrote:
It works … but why should I use this snippet instead of common CSS?
Because people who disable Javascript (this happens) will not be able to launch fancyBox neither see the images hidden with css (unless they disable css too, but these are rare). jQuery solution hides the thumbnails only in JS-enabled browsers (large majority), while still letting the others see the whole gallery.
Edit: but it does not seem to work, my jQuery selectors must be faulty.
Last edited by etc (2012-11-20 16:22:25)
Offline
Re: How to display one thumbnail and show several images in slide?
RedFox: it’s possible, but you’ll need smd_gallery. Please check this forum thread: Single image that leads to image set for my example.
…Prrrrrrrr…
Offline
Re: How to display one thumbnail and show several images in slide?
…but it does not seem to work, my jQuery selectors must be faulty.
Mmm … that’s strange, because my page (and all the code) is doing a great job … !?
BTW … let me show you (all) the real power of smd_macro … :)
Endless lightbox galleries on one page by giving each lightbox tag a unique rel … e.g. > <txp:lightbox_more id="6,25,47" label="" rel="whatever" /> with this smd_macro code snippet >
<txp:images id="{img_id}" category="{cat}" wraptag="ul" break="li" class="lightbox-one" sort="rand()" label="{titel}" labeltag="h6">
<a href="<txp:image_url />" class="fancybox" rel="{gallery}">
<txp:smd_thumbnail type="thumb" />
</a>
</txp:images>Last edited by RedFox (2012-11-20 21:24:06)
Offline
Re: How to display one thumbnail and show several images in slide?
RedFox wrote:
that’s strange, because my page (and all the code) is doing a great job … !?
Yes, it works fine now, I must have been checking at bad moment.
I like your site adaptive design, btw, looks great even on small screens. Wish txp forum were designed this way. :)
Offline
Re: How to display one thumbnail and show several images in slide?
Oleg and Arjan … look at my (edit) former post … smd_macro magic … :)
Last edited by RedFox (2012-11-20 21:28:22)
Offline