javascript img rotation on click + flexible size = fun?

squaredeye · 2007-01-29 02:15:19

I need help thinking through this one :)

I’ve got an elastic layout that I’ve got some images that also flex.
In the CSS, they are given the rule width: 100%, and since the images
have no specified height or width, the image grows or shrinks proportionately with
the container div.

GOAL:
I’d now like to have a list of images (3-5), that rotate on-click using JS.
(much like this one)
I am speculating that the above example might not be the best option, but it illustrates my need.

STIPULATIONS:

these images need to be placed by upm_image
I need the images to retain their flexibility (this has been difficult to find).

Possible?

THE ALTERNATIVES:
I can imagine using a lightbox scenario, although I find these overdone, and slightlly dramatic, for what should be a simple and quick movement for a user.

masa · 2007-01-29 02:25:42

ma_smith wrote:

I can imagine using a lightbox scenario, although I find these overdone, and slightlly dramatic, for what should be a simple and quick movement for a user.

I’m with you on this one – have been looking for something similar myself. In the WYSIWYG editor I used to use this was blissfully easy to set up.

I wonder if there’s a way to get rid of the tedious transition effects in Lightbox. If the images would just snap into place, that would definitely be my ticket.

Cheers Martin

squaredeye · 2007-01-29 02:31:22

Martin,
Glad to hear I have some backup :)
for me its not just the transitions, although those really take it overboard. Its the question of whether or not a modal window is appropriate for what I want to achieve. Which in my case, I believe it is not.

masa · 2007-01-29 02:45:09

I agree. I try to keep things simple myself.

There’s all sorts of lovely gallery- and slideshow plug-ins available for txp, but it sure would be a nice addition to have a bone-simple one that allows users to flip through the images in situ just by clicking them or employing an automatically generated pair of << >> arrow links.

An excellent candidate for the plug-in request listing, huh!?

Last edited by masa (2007-01-29 02:45:45)

masa · 2007-01-29 03:11:10

Now that you’ve got me thinking about it, I’m just throwing out some more ideas here…

What I like very much about Lightbox is the fact, that when you hover over the image it displays a previous or next image indicator depending on whether you hover over the right or left area. I’d prefer small arrow icons to appear, but that could probably done by simply substituting such images in anyone’s custom installation as is the case with Lightbox.

It would also be a nice addition to add an attribute setting, allowing to display plain-text links like previous | next just below the image.

Also an attribute to auto-run and loop the slideshow would be terriffic!

<txp:slideshow showtextlinks=“1” autorun=“1” loop=“1”>

What do you think?

Last edited by masa (2007-01-29 03:16:37)

squaredeye · 2007-01-29 03:16:11

hmm, not for me :)
I think that’s a nice feature, and accomplished with other scripts out there.
I am looking for flexible (scalable) image proportions and no gimmickery.

masa · 2007-01-29 03:20:25

ma_smith wrote:

I think that’s a nice feature, and accomplished with other scripts out there.

Would you mind giving me a hint as to what scripts you had in mind? :-)

squaredeye · 2007-01-29 14:21:06

I’ve been googling for awhile on this, and have found more than enough lightbox effects using mootools or prototype that will do what you’re looking for.

here’s a good start

:)

maniqui · 2007-01-29 14:45:50

ma_smith wrote:

I am looking for flexible (scalable) image proportions and no gimmickery.

Hi Matthew,

maybe this can be helpful: simple jquery slideshow

You may need to adapt it to your needings.
The thing about flexible size… do you want your images to adapt always to 100% of the div width?
The images are going to be pixelated if they are tiny or huge… or am I wrong?

hakjoon · 2007-01-29 15:20:11

You could also check out the jQuery jCarousel which can do a pretty nice simple slideshow .

mrdale · 2007-01-29 17:33:14

That jQuery stuff is pretty cool Hak. And a combo of wet_for_each_image and upm_image should allow for some pretty cool TXP Galleries.

I always wanted to integrate something like this gallery with TXP, but didn’t have the PHProps. I helped create this script which is a variant of this that adds controls and slideshow features as well as a small/medium/large image size. Pretty old stuff really (almost 3 years), I can only imagine what it looks like on the IEs. Maybe it’s useful.

hcgtv · 2007-01-29 18:19:33

mrdale wrote:

I always wanted to integrate something like this gallery with TXP, but didn’t have the PHProps.

You don’t really need that much PHP skills nowadays, it’s more abut HTML and CSS than anything else.

This slideshow in my sample gallery can be made to look like you want it very easily.

Textpattern CMS

Textpattern CMS support forum

#1 2007-01-29 02:15:19

javascript img rotation on click + flexible size = fun?

#2 2007-01-29 02:25:42

Re: javascript img rotation on click + flexible size = fun?

#3 2007-01-29 02:31:22

Re: javascript img rotation on click + flexible size = fun?

#4 2007-01-29 02:45:09

Re: javascript img rotation on click + flexible size = fun?

#5 2007-01-29 03:11:10

Re: javascript img rotation on click + flexible size = fun?

#6 2007-01-29 03:16:11

Re: javascript img rotation on click + flexible size = fun?

#7 2007-01-29 03:20:25

Re: javascript img rotation on click + flexible size = fun?

#8 2007-01-29 14:21:06

Re: javascript img rotation on click + flexible size = fun?

#9 2007-01-29 14:45:50

Re: javascript img rotation on click + flexible size = fun?

#10 2007-01-29 15:20:11

Re: javascript img rotation on click + flexible size = fun?

#11 2007-01-29 17:33:14

Re: javascript img rotation on click + flexible size = fun?

#12 2007-01-29 18:19:33

Re: javascript img rotation on click + flexible size = fun?

Board footer