After My Previous Post J-Query Text Slider Without Navigation.Many People Send Me Request To Share A Testimonial Slider Without JQuery Because It Will Increase There Loading Time, So Here I Am Again With The New And Only JavaScript Code.As many people want Testimonial slider for there website and blog to show there visitor that they have good response from there Great User. For this purpose they want text box but if they have more then one testimonial there is a big problem to them how to manage them all without wasting extra space from there site and blog.So i am here with a new article and a awesome JavaScript so that you can user this on your site or blog, it is easy to install and quick to load with navigation menu so that visitor can see how many testimonial you have.
Now it is also called JavaScript Text Ticker You can customize the fill code easily through the given step, You can customize this testimonial box container also with your CSS, In this slider you can also add author name with there caption.Text style, size color, format, font any thing you can easily customize, If you don’t know How To Customize Feel Free To Ask. I Will Help You.
One More Thing That This Is A Copyright Code Of Dynamic Drive (www.dynamicdrive.com) I Jsut Update It And Share It.
Table of Contents
Features:
1.) Unlimited Testimonials Quotes.
2.) Only JavaScript And CSS.
3.) Simple Full Customizable Box Container.
4.) Quick To Load And Easy To Install.
5.) With Write Name, Pic, Website And Caption Space.
How To Add In Blogspot?
1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To “Layout“.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT“
6.) Click “+” Icon To Add It.
7.) Now Copy The Below Code And Paste It To There.
8.) Leave The Title Empty.
9.) Click Save, Now You Are Done.
How To Add In Website?
1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between <body> </body>.
3.) Save It, Now You Are Done.
<!-- This Is A CopyRight Code.It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action. --><style type="text/css">#exetestiauthor{width: 250px;font-weight: bold;border: 1px solid black;background-color: #DFDFFF;font-size: 20px;font-style: oblique;padding: 3px;}.exetestitext{width: 250px;
height: 200px;border: 1px solid black;background-color: #DFDFFF;padding: 3px;display:block;}.exetestipic {float:left;margin:0 5px 0 0;border-radius: 100px !important;}</style><script type="text/javascript">/************************************************ ProHTML Ticker script- © Dynamic Drive (www.dynamicdrive.com)* This notice must stay intact for use* Visit http://www.dynamicdrive.com/ for full source code.* UpDated By- © EXEIdeas International (www.exeideas.com)* Visit https://www.exeideas.com/ for full info.***********************************************/var tickspeed=2000 //ticker speed in miliseconds (2000=2 seconds)var enableexeauthor=1 //enable scroller exeauthor? Set to 0 to hideif (document.getElementById){document.write('<style type="text/css">n')document.write('.exetestitext{display:none;}n')document.write('</style>n')}var selectedDiv=0var totalDivs=0function contractall(){var inc=0while (document.getElementById("exetestidiv"+inc)){document.getElementById("exetestidiv"+inc).style.display="none"inc++}}function expandone(){var selectedDivObj=document.getElementById("exetestidiv"+selectedDiv)contractall()document.getElementById("exetestiauthor").innerHTML=selectedDivObj.getAttribute("exeauthor")selectedDivObj.style.display="block"selectedDiv=(selectedDiv<totalDivs-1)? selectedDiv+1 : 0setTimeout("expandone()",tickspeed)}function startscroller(){while (document.getElementById("exetestidiv"+totalDivs)!=null)totalDivs++expandone()if (!enableexeauthor)document.getElementById("exetestiauthor").style.display="none"}if (window.addEventListener)window.addEventListener("load", startscroller, false)else if (window.attachEvent)window.attachEvent("onload", startscroller)</script><div id="exetestiauthor"></div><div id="exetestidiv0" class="exetestitext" exeauthor="Writer Name"><img class="exetestipic" height="80" width="80" src="Writer Pic URL" />Your Testimonial Text.<p align="right"><a href="Writer Website URL">Writer Website Name</a></p></div><div id="exetestidiv1" class="exetestitext" exeauthor="Writer Name"><img class="exetestipic" height="80" width="80" src=" Writer Pic URL " />Your Testimonial Text.<p align="right"><a href="Writer Website URL">Writer Website Name</a></p></div><div id="exetestidiv2" class="exetestitext" exeauthor="Writer Name"><img class="exetestipic" height="80" width="80" src=" Writer Pic URL " />Your Testimonial Text.<p align="right"><a href="Writer Website URL">Writer Website Name</a></p></div><!-- This Is A CopyRight Code.It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Should Be Under Legal Action. -->
Customization:
1.) Change “Width” and “Height With Your Desired Pixel.
2.) Change “Your Testimonial Text…” With Your Testimonial Text.
3.) Change “Writer Name” With Your Testimonial Writer Name .
4.) Change “Writer Website URL” With Your Testimonial Writer Website URL.
5.) Change “Writer Website Name” With Your Testimonial Writer Website Name.
6.) Change “Writer Pic URL” With Your Testimonial Writer Pic URL.
7) If You Want More Customization, Feel Free To Ask Otherwise Save And Enjoy.
Hmm, this is a very nice idea. I’ll definitely give this a try on one of my blogs. 🙂
Thanks…
Hello Muhammad,
I’m trying to use your code on my computer repair business website and when I stick the code before the body tag what is telling it what specific spot I want the box to show? I tried putting the code in the spot I wanted it but it just showed all three testimonials in the spot I put the code and it did not show the color of the box or rotate the testimonials.
Chris
You Have To Put This Code In A DIV Where You Want To Show It, Copy The Whole Scrap. If Still Did Not Work, Let Me See Your Page URL…
Thank you, Love this code, it is so easy to use and it is perfect for what I need.
You Are Welcome To Visit Us And Use Our Code.
Nice idea, but, i think it can make a blog/web to weigh and slow in loading time
Thanks For Liking, It Will Not Increase Loading Time Because It Didn’t Contain And External Code Link…
Great little gadget. The only problem I’m having with it is this: All other html/java gadgets beneath this one shift up and down depending on the length of the testimonial. If I could fix the height of it, or something like that, that would be brilliant because I can’t use it as it is. Everything else about it works really well. Thanks.
Make a div abound it and fix that height. Rest we have to see it live in action for your problem.