Skip to main content
Known Participant
September 16, 2010
Question

ColdFusion slideshow possibilities?

  • September 16, 2010
  • 2 replies
  • 2258 views

Hello;

I am trying to come up with a way to make a coldfusion slideshow using cf code and javascript. I am hoping someone can help focus me into a proper solution. In my head, it seems kind of easy, I would just need a java script "timer" of sorts to cycle through all the records in the database, or turn it off and do it manually. I am going to post my coldfusion portion of the code.. maybe someone can either point me in the direction of a site with a tutorial, or help me with the java portion?

Normal cf query with paging function-

<cfquery NAME="slideShow" datasource="#APPLICATION.dataSource#">
SELECT ID, mainImage, content
FROM slide
ORDER BY ID
</cfquery>
<cfset rowsPerPage = 1>
<cfparam name="URL.startRow" default="1" type="numeric">
<cfset totalRows = slideShow.recordCount>
<cfset endRow = min(URL.startRow + rowsPerPage - 1, totalRows)>
<cfset startRowNext = endRow + 1>
<cfset startRowBack = URL.startRow - rowsPerPage>

<cfloop query="slideShow" startRow="#URL.startRow#" endrow="#endRow#">

<cfoutput>

#mainImage#
#content#
</cfoutput>

</cfloop>

I'm not loading it up with layout code or anything.. I am just putting the hard code for this.. I also want to have links to go back to each record, something like this....

<cfset thisPage = 1>
<cfloop from="1" to="#totalRows#" step="#rowsPerPage#" index="pageRow">
<cfset isCurrentPage = (pageRow gte URL.startRow) and (pageRow lte endRow)>
<cfif isCurrentPage>
<cfoutput>#thisPage#</cfoutput>

<cfelse>

<cfoutput>
<a href="#CGI.script_name#?startRow=#pageRow#" class="nav">#thisPage#</a>

</cfoutput>

</cfif>
<cfset thisPage = thisPage + 1>
</cfloop>


I am not sure how easy it is going to be to make it automatically go through the records without reloading the page.. maybe using an ajax control or javascript is what I'm thinking. I know this can be done in flash, but I'm not good enough with flash to use remoting and create it...

Can anyone either point me in the right direction or help me out with a script that might work this type of a small app?

Thank you

This topic has been closed for replies.

2 replies

Inspiring
September 27, 2010

Yup.  You're going to likely have to use a javascript solution or Flash (or something similar).

As Bob suggested, the jQuery Cycle plugin works well for this (I've done some pretty cool slideshows using the cycle plugin over the past couple years) http://jquery.malsup.com/cycle/.

Personally I prefer the jQuery Tools Scrollable plugin (with autoscroll plugin) http://flowplayer.org/tools/scrollable/autoscroll.html.

Either of these solutions can be styled to look pretty much any way you want (you'd be surprised at how flexible the solutions are).  If you're having trouble designing something, ask around for a good css designer.  Same with javascript (if you're new to js and not ready to take the plunge (although admittedly jQuery makes javascript easy)).

Inspiring
September 16, 2010

Do you have to use Javascript for this?  Are the presentation features built into CF an option?  See CF docs linked below.

"Creating Slide Presentations"

http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24-6ffc.html

Known Participant
September 16, 2010

It would be PERFECT.. if I was on a cf server 9! *(&^%&$^%#&^^( My hosting company isn't running 9 in a shared environment yet.

Is there a way to make this work in cf8? aside from cfpresentation? That stinks.. it would have worked perfectly! So now I'm forced to make controls? A cfscript maybe with a timer and fade effect? would that work? then how would I write it?

Inspiring
September 16, 2010

I would look for a JavaScript option for creating your slideshow.

Take a look at: http://jquery.malsup.com/cycle/