Creating an image-slider from content - a job for /base?
Hi Umbracians!
I'm currently working on a project where I need to create an image-slider using JavaScript (jQuery in this case). The content that's going to be used for the slider comes from the childnodes of the node "Reklamer" in Umbraco like this:
The properties I have on these nodes are: textstring (header), bodytext (rich text editor) and a media picker.
The end result on the frontend will have to look something like this:
So every 10 second (or so) the content need to fade out and the next will fade in.
What I have been considering to do is to combine jQuery and /base for this. A simple C# method that gets the XML data for a given node by id (which in this case will be a childnode of "Reklamer")
However, what struck me is if I have, say, 20+ nodes and I'm calling the above mentioned method every 10th second, wouldn't that be quite a lot of traffic to the database, or am I wrong about this?
Hope it make sense! If not, please let me know and I will try to elaborate :)
i make these conent rotators all the time... using jqueryCycle() -- awesome plugin!
anyway, it takes a list or series of divs and rotates them... i use plain old xslt to render out a ul li list or a series of divs, etc. -- nothing special at all... and let jquery cycle take care of the rest.
let me know if that provides another option for your consideration.
Beautiful ! I didn't know of the jQuery Cycle plugin, that makes everything a lot easier :) And it works right out of the box aswell - just great! Thanks a lot Bob! Greatly appreciated!
However, I am missing one feature in it: to be able to control the delay for each element being shown. The delay parameter seems to only affect the first slide :/ I have looked through the options for the plugin but couldn't find anything on this. Am I missing out something here, or do you perhaps know of a 'fix' for this? ;)
so baically, you can do another for-each loop to just grab the delay in seconds [a property on your content node] to create the delay array [hey that rhymes :)]
i would recommend a default in your scripting as well...
Thanks a lot, the timeout function was really neat! But I figured out I just needed to set timeout: 10000 on my cycle(), I guess I mixed up "timeout" and "delay" - everything works as a charm!
Creating an image-slider from content - a job for /base?
Hi Umbracians!
I'm currently working on a project where I need to create an image-slider using JavaScript (jQuery in this case). The content that's going to be used for the slider comes from the childnodes of the node "Reklamer" in Umbraco like this:
The properties I have on these nodes are: textstring (header), bodytext (rich text editor) and a media picker.
The end result on the frontend will have to look something like this:
So every 10 second (or so) the content need to fade out and the next will fade in.
What I have been considering to do is to combine jQuery and /base for this. A simple C# method that gets the XML data for a given node by id (which in this case will be a childnode of "Reklamer")
However, what struck me is if I have, say, 20+ nodes and I'm calling the above mentioned method every 10th second, wouldn't that be quite a lot of traffic to the database, or am I wrong about this?
Hope it make sense! If not, please let me know and I will try to elaborate :)
Thanks in advance!
/ Bo
@Bo...
i make these conent rotators all the time... using jqueryCycle() -- awesome plugin!
anyway, it takes a list or series of divs and rotates them... i use plain old xslt to render out a ul li list or a series of divs, etc. -- nothing special at all... and let jquery cycle take care of the rest.
let me know if that provides another option for your consideration.
Beautiful ! I didn't know of the jQuery Cycle plugin, that makes everything a lot easier :) And it works right out of the box aswell - just great! Thanks a lot Bob! Greatly appreciated!
AWESOME... glad it was what you were looking for! i have created some pretty crazy little rotators with cycle and absolutely love it...
feel free to ask if you have any questions... just a quick hint...
the onBefore() and onAfter() hooks are great for animating in teh text, panels, etc.
Have FUN!
Indeed, that's really a powerful plugin! :)
However, I am missing one feature in it: to be able to control the delay for each element being shown. The delay parameter seems to only affect the first slide :/ I have looked through the options for the plugin but couldn't find anything on this. Am I missing out something here, or do you perhaps know of a 'fix' for this? ;)
Thanks again!
All the best,
Bo
@Bo
check the reference page here... http://jquery.malsup.com/cycle/options.html
and look specifically at the delay parameter... i think that is what you need -- note, it can be negative too :)
doh, sorry... i did not read your post very well... i see that you already have the delay param located...
check out the last item on the faq page... that might be a better solution :)
http://jquery.malsup.com/cycle/faq.html
so baically, you can do another for-each loop to just grab the delay in seconds [a property on your content node] to create the delay array [hey that rhymes :)]
i would recommend a default in your scripting as well...
there is a nice example here...
http://jquery.malsup.com/cycle/timeout2.html
Thanks a lot, the timeout function was really neat! But I figured out I just needed to set timeout: 10000 on my cycle(), I guess I mixed up "timeout" and "delay" - everything works as a charm!
Thanks for your help :)
is working on a reply...