For more information about the jQuery plugin, visit this page: https://github.com/peachananr/simple-text-rotator
Here's a link to my Fiddle: https://jsfiddle.net/jzhang172/8msf91wa/
Make sure to check out my external Fiddle link, as the code here may not be functioning properly.
I'm trying to style the color of specific words using custom CSS, but I'm having trouble figuring it out:
$(document).ready(function(){
$(".rotate2").textrotator({
animation: "dissolve", // Choose an animation effect for word rotation: dissolve, fade, flip, flipUp, flipCube, flipCubeUp, or spin.
separator: ",", // Define a custom separator (e.g., |, &, *) instead of commas.
speed: 2000 // Set the speed of word transition in milliseconds.
});
});span.color1{
color: red !important;
}<link href="https://cdnjs.cloudflare.com/ajax/libs/simple-text-rotator/1.0.0/simpletextrotator.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/simple-text-rotator/1.0.0/jquery.simple-text-rotator.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Hey, <span class="rotate2">Friend, <span class="color1">sir</span>, ma'am</span>