Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#16 2011-06-28 18:04:21

hicks
Member
From: Portland, OR, USA (ex-UK)
Registered: 2009-05-08
Posts: 106
Website

Re: Ultra-simple slideshow wanted

Joe,

That only applies if your slideshows have different classes or IDs. Mine are all the same. At some point, I will probably wangle some way of making them all different using article forms with the init codes with those slideshow classes based on article ID in the header, the code in those forms enclosed with a <txp:upm_if_article_image_list> to avoid unnecessaries inits, then apply the article ID-based class tags to the divs within the body article’s article form… off the top of my head.

Offline

#17 2011-06-28 18:05:39

mrdale
Member
From: Walla Walla
Registered: 2004-11-19
Posts: 2,215
Website

Re: Ultra-simple slideshow wanted

simpler? core txp jquery.

<txp:images category="cycle" wraptag="div" class="slideshow" break="">
   <txp:image />
</txp:images>
<script>
$(function(){
  $('.slideshow img:gt(0)').hide();
  setInterval(function(){$('.slideshow :first-child').fadeOut(3000).next('img').fadeIn(3000).end().appendTo('.slideshow');}, 6000);
});
</script>

forgot the css…

div.slideshow{
float:right;
clear:none;
position:relative;
height:300px;
width:500px;
overflow:hidden;
}

.slideshow img {
position:absolute;
left:0; top:0;
width:100%;
height:auto;
}

Last edited by mrdale (2011-06-28 18:08:59)

Offline

#18 2011-06-30 00:29:29

hicks
Member
From: Portland, OR, USA (ex-UK)
Registered: 2009-05-08
Posts: 106
Website

Re: Ultra-simple slideshow wanted

Turned out Cycle’s sync setting had nothing to do with the sync I was on about; of course, it was its next designation. I made an article form:

<txp:upm_if_article_image_list>
<script type="text/javascript">
$(document).ready(function() {
    $('#a<txp:article_id/>').cycle({
	fx:     'fade', 
    speed:   100, 
    timeout: 3000, 
    next:   '#a<txp:article_id/>', 
    pause:   1
	});
});
</script>
</txp:upm_if_article_image_list>

and put articles in the header with that form, disallowing form overrides. Then I gave any slideshow divs an id="a<txp:article_id/>" in the regular article forms. Works now. Niggle gone. I guess it might have worked with the $('.slideshow').cycle({ still in there rather than $('#a<txp:article_id/>').cycle({ but if it ain’t broke…

Offline

#19 2011-06-30 02:21:01

joebaich
Member
From: DC Metro Area and elsewhere
Registered: 2006-09-24
Posts: 507
Website

Re: Ultra-simple slideshow wanted

mrdale wrote:

simpler? core txp jquery.

Very, very nice MrDale and elegant too. It’s the core jQuery in general that still eludes me. Time to get the long burning candles out and do some old fashioned study.

Joe

Offline

#20 2011-06-30 15:36:18

hicks
Member
From: Portland, OR, USA (ex-UK)
Registered: 2009-05-08
Posts: 106
Website

Re: Ultra-simple slideshow wanted

Mr Dale,

What would your code replace and discard in Tye’s how-to? I’m fairly clueless at scripting; I’m more of a cut-n-paste-n-alterer.

Chris.

Offline

#21 2011-06-30 18:18:21

mrdale
Member
From: Walla Walla
Registered: 2004-11-19
Posts: 2,215
Website

Re: Ultra-simple slideshow wanted

hicks wrote:
What would your code replace and discard in Tye’s how-to?

It’s a straight replacement, the only benefit of mine is one less js library, no need to…

<!-- include Cycle plugin -->
<script type="text/javascript" src="<txp:site_url />js/jquery.cycle.min.js"></script>

Offline

Board footer

Powered by FluxBB