aro_slideshow v2

rloaderro · 2007-04-02 17:56:31

dobidolots wrote:

Aeron, would there be a way to allow visitors to pause a slideshow? I looked through all the current features and find methods to select individual images from thumbs or to move forward or backward with arrows, but no pause button. Did I miss it or is it simply ‘out-of-scope’ for this version?

I think that’s something I have contemplated for the next update. I’m a bit busy right now, but I will try to post the update and other stuff I’m working on this month.

burn · 2007-04-06 13:49:30

Hello guys,

I found the script not only amazing but also very easy to implement, it’s been a blast. The only one feature I’m missing for it is a “links” array to get along with images and captions.. I really need the single pictures to be linkable. Can someone help me figure it out? I tried to read through the source but I’m too green in JS classes to be able to understand and modify.

Any help appreciated! Thanks already for the great work!

Luca

rloaderro · 2007-04-09 21:52:06

burn wrote:

I found the script not only amazing but also very easy to implement, it’s been a blast. The only one feature I’m missing for it is a “links” array to get along with images and captions.. I really need the single pictures to be linkable. Can someone help me figure it out? I tried to read through the source but I’m too green in JS classes to be able to understand and modify.

This would be slightly tricky if you weren’t pretty adept at both JS and PHP – at least in order for this to work with the TXP plugin as well. I will add something for this in the next version, but as things are going with work this will probably be a few weeks…

burn · 2007-04-11 17:57:02

I’ll be happily waiting, I’m definitely not good enough with JS to change your class. I’ll keep checking for the update every once and a while :)

Jiwoon · 2007-04-18 23:54:10

Hey guys, is there any way to display the pictures randomly? This already amazing script will be completed with random display feature.

jgdobbins · 2007-04-20 06:33:02

Hi Jiwoon, I have it working randomly with the following line of syntax;

<txp:aro_slideshow category=“photos” orderby=“random” show=“caption” type=“pan” duration=”[4000, 7000]” height=“470” width=“710” />

www.n4mdesign.com

Cheers,
JD

rloaderro · 2007-04-20 18:18:56

Hey guys, is there any way to display the pictures randomly? This already amazing script will be completed with random display feature.

Well, there is the orderby="random" that jg mentioned – but this will only load the images randomly each time the page loads, and not display them randomly as the slideshow loops. I guess that is something I can work into the next version though.

mhulse · 2007-06-10 06:13:55

Hi!

Great script. I decided to implement manually. Works perfectly. :)

A few quick questions:

1. Any way to allow for just the “arrows” to “animate” the slideshow? The best work-around that I can think of would be to set a really long time for transitions (i.e. so long that it never changes, except after a long time ;) .)

2. I plan on having set widths for images, but (possibly) not heights… I have yet to test, but will images of differing heights get scaled un-proportionally to fit the initial height? If so, any fix (not that it is broken), or should I just plan making sure I use the same height for all images?

Other than that, a million THANKS! :D

This script is perfect for my current project. I hope I can help you with something one of these days. Let me know if you ever need help setting this up for an Expression Engine plugin. :)

Have a great day,
Cheers,
M

Last edited by mhulse (2007-06-10 06:27:52)

rloaderro · 2007-06-11 15:54:19

mhulse wrote:

Any way to allow for just the “arrows” to “animate” the slideshow? The best work-around that I can think of would be to set a really long time for transitions (i.e. so long that it never changes, except after a long time ;) .)

At the moment, that is exactly how you would need to do it. Naturally it would only really be effective for push/wipe or fade slideshows.

I plan on having set widths for images, but (possibly) not heights… I have yet to test, but will images of differing heights get scaled un-proportionally to fit the initial height? If so, any fix (not that it is broken), or should I just plan making sure I use the same height for all images?

If resizing is enabled then images will be scaled proportionally – this should be true for all slideshows.

Let me know if you ever need help setting this up for an Expression Engine plugin. :)

If you would like to write a EE plugin I would be happy to link to it from the Slideshow page ;) Thanks for your kind works and I hope the scripts work well for you! Cheers…

Last edited by rloaderro (2007-06-11 15:54:38)

mhulse · 2007-06-11 19:51:24

Hi rloaderro! Many thanks for your quick reply. I really appreciate the help.

rloaderro wrote:

At the moment, that is exactly how you would need to do it. Naturally it would only really be effective for push/wipe or fade slideshows.

Ah, good to hear I was not totally off the wall with my thinking. Hehe, works for me.

Fade is my pick for now. It works great! Though, I am wondering if I should be using the plugin instead of my own concoction of TXP/php.

If resizing is enabled then images will be scaled proportionally – this should be true for all slideshows.

Ah, I see. Sounds good to me. :)

If you would like to write a EE plugin I would be happy to link to it from the Slideshow page ;) Thanks for your kind works and I hope the scripts work well for you! Cheers…

Many thanks again to you! This plugin/code has been of great help.

I will look into the EE plugin setup… Once I have a bit of free time I would love to give back to the community by helping out with this type of stuff.

Have a great day rloaderro,
Cheers,
Micky

mhulse · 2007-06-14 00:42:38

Hello… Me again. :)

Everything is working great! Again, great plugin and thanks for sharing with the rest of us.

Just wondering how hard it would be to incorporate a loading image for the initial start of the slideshow (when folks first come to page.)

Is there a way I could incorporate a call-back function to do such a thing?

My initial thought was to use the placeholder image (I am using this script manually on my TXP site) as a “loading” image… But then I realized that I will run into problems if I jury-rig the plugin for manual navigation (i.e. set real long display times… see post #44 for more info.)

Any thoughts? Sorry to be bugging you with silly questions.

Again, I really appreciate your plugin and help.

Have a great day/night!
Cheers,
Micky

Last edited by mhulse (2007-06-14 08:22:16)

mhulse · 2007-06-14 07:18:27

I just wanted to share a bit of CSS.

Using the “arrow” navigation, my goal was to have the whole image click-able, and only move forward through slides.

Below is my CSS solution (so far, only tested via FF/XP.)

Notes:

The #banner ID is the name of my slideshow div.
Fortunately, I am loading images that all have the same width and height… I kinda wish I could put inline styles on the markup (set the width/height on UL for example), but the slideshow JS ignores that.
I am using a resets.css file, so you may have to tweak a few things to suit your particular CSS setup.
Test page

/* Slideshow css by mhulse: */
/* Container: */
#sub { width: 800px; margin: 0 auto; } /* Parent container. */

/* Set container to relative for AP children: */
#sub #banner { position: relative; }
#sub #banner ul li {
	list-style: none;
	width: 800px; /* Width of image. */
	height: 500px; /* Height of image. */
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000; /* Auto z-index (default) should suffice. */
}
/* Make the "next" link fill the contents of parent: */
#sub #banner ul li a.next {
	display: block;
	width: 100%;
	height: 100%;
	/* I noticed that when I gave this element a background color, the link became clickable in IE7/XP.
	** Because I did not want to cover-up my image(s) with a color, I am using a fully transparent 50px X 50px gif: */
	background: url(/images/template/blank-50x50.gif); /* Needed for IE7. */
	/* The only cross browser syntax for a pointer/hand is below. */
	/* Note that the two declarations must be in this order: */
	cursor: pointer;
	cursor: hand;
}
/* Hide the "prev" link: */
#sub #banner ul li a.prev { display: none; }

<div id="banner">
	<div><img src="test.jpg" width="800" height="500" alt="" /></div>
	<ul>
		<li><a class="prev" href="#"></a></li>
		<li><a class="next" href="#"></a></li>
	</ul>
</div>

Last edited by mhulse (2007-06-19 06:40:37)

Textpattern CMS

Textpattern CMS support forum

#37 2007-04-02 17:56:31

Re: aro_slideshow v2

#38 2007-04-06 13:49:30

Re: aro_slideshow v2

#39 2007-04-09 21:52:06

Re: aro_slideshow v2

#40 2007-04-11 17:57:02

Re: aro_slideshow v2

#41 2007-04-18 23:54:10

Re: aro_slideshow v2

#42 2007-04-20 06:33:02

Re: aro_slideshow v2

#43 2007-04-20 18:18:56

Re: aro_slideshow v2

#44 2007-06-10 06:13:55

Re: aro_slideshow v2

#45 2007-06-11 15:54:19

Re: aro_slideshow v2

#46 2007-06-11 19:51:24

Re: aro_slideshow v2

#47 2007-06-14 00:42:38

Re: aro_slideshow v2

#48 2007-06-14 07:18:27

Re: aro_slideshow v2

Board footer