Hopefully the plug-ins and classes I write are simple enough to figure out and manipulate. Its an extremely simple and customizable little testimonial rotator that also supports HTML. So yes your quotes can have links, logos or even avatars. It will support as many quotes or testimonials you may need. The options that can be set are speed (number), json (JSON file URL), and what quote you want to start from (number).
If you have any feature requests, questions, or issues please drop me a comment and I would love to help you out. Here are the details and usage for each of the particular frameworks.
jQuery
$('#container').quotator();
MooTools
var myQuotes = new Quotator('container');
The JSON
By default it looks for a file called quotes.js which is a simple JSON file that looks something like this:
{"quotes":
[{
"quote" : "Quote 1",
"author" : "Author 1"
},{
"quote" : "Quote 2",
"author" : "Author 2"
}]}
Demo and Download
You can see it in action here.
Download a zip for jQuery here.
Download a zip for MooTools here.
14 Responses
Nice post/class. Will see if I can find an excuse to use it.
Thanks a ton! Good to know someone has crossed this site.
Man, what’s even funniest is this:
Check out the two url’s:
http://merrickchristensen.com/
http://olivernassar.com/
Notice any similarities? lol.
Ya, I’ve added your to my blog roll. While I deal with everything in the LAMP stack as well as client side/mootools stuff, I think we may overlap somewhat. You have a great url though. Tons of possibilities with it.
Hehe, that is funny.
Thanks for adding me to your blog roll! I will be following you as well. And thanks for your compliments on the URL I was really shocked that it was available. Anyways, see you around the interwebs.
I am receiving an error in internet explorer. The testimonials run at first then instead of repeating, the script stops and throws an error quotator.js line 28, saying that “quotesobject[...].quote is null or not an object” and i tried using the mootools version but it wont even work at all in any browser i try. i just an access is denied error with mootool. Strange thing is the demo page works but when i download it, wont work at all.
Can you help?
I would love to… Do you have a link?
Thanks, heres the site im working on. http://go2umrah.com/test00
[...] [UPDATE] This is now hosted on http://thejavascriptblog.com/the-quotator-the-json-driven-html-rotator/ [...]
[...] [UPDATE] This is now hosted on http://thejavascriptblog.com/the-quotator-the-json-driven-html-rotator/ [...]
Hi,
great little bit of coding. Dead easy to set up. One thing I have an issue with is the Jquery FadeIn cleartype bug. After the 1st quote, the cleartype is removed and the text looks awful.
I’ve found the fix, but am struggling to work out where to apply it. Having said that, your demo doesn’t seem to have that issue.
Any help would be great –
Cheers
Mike
Mike,
I would love to help you up and am hoping to release a new version of this in January 01, 2010. The demo is using the MooTools version thus the better display of fonts. MooTools rules.
Send me a link to the site of question and I’ll look at it.
Thanks for the kind words on the script. And cool gravatar… Where is everyone getting those?
Hi Merrick. Cool plugin!
Is there a way to show random quotes?
Thanx
I’m working on a new one! It has random quotes, and much more options! I’ll be sure to post it here when its done… Just so busy! Thank you for your interest!
[...] add rotating testimonials using the quotator (I love that name!) I created a PHP backend to so that the testimonials are stored in an array and [...]