Ecopro slider play buttons as images

[danielgreencharternet 0]

Hello, Loving the ecopro theme. On the platform pro and iblog themes we got we can use custom thumbs for the play buttons on the feature slider. Is this possible on ecopro?

[kastelic 6]

No, not from the control panel. If you really needed to do it, you could use some custom javascript to basically say "give the first one this class and give the second one this class etc." The classes would add an appropriate background image.

[danielgreencharternet 0]

Really need to do it is a great question. I think I can do this with cs and rollover images-done it on sites where we wrote the css. Just confused a bit by this articular css-not sure which to change. This looks like the css in charge. Would you create a new class and edit the theme - not sure about the feature nav span. Thanks for answering.

#featurenav a.activeSlide, #featurenav span:hover {
	    background: none repeat scroll 0 0 #FFFFFF;
	    color: #000000;
	}
	pro.css?ver=3.0.4 (line 35)
	#featurenav a, #featurenav span {
	    background: none repeat scroll 0 0 #000000;
	}
	color_...r=3.0.4 (line 5)
	#featurenav a, span.playpause {
	    -moz-border-radius: 3px 3px 3px 3px;
	    background: none repeat scroll 0 0 #4C6E10;
	    color: #FFFFFF;
	    font-family: arial;
	    font-size: 12px;
	    margin-right: 7px;
	    padding: 4px 8px;
	}
	

[catrina 103]

I would try using the same class, but just edit the code for that class. Can you post a link to your site?

[danielgreencharternet 0]

Hi Catrina, Sure-any help is much appreciated. Here's the link website Here are links to the images too. We may need to re-size later but for this exercise they will do. Don't laugh-they are little goats:) Well, okay, you can laugh. Inital image for play button Hover version

[kastelic 6]

Oh, okay, if you don't need different images for each one then you only need to use CSS. Adding these two rules to the custom css box should do the trick. You will want to make your images 23px by 23px.

	body #featurenav a{
	   background: #dd0083 url(LOCATION-OF-YOUR-IMAGE) no-repeat;
	}
	body #featurenav a.activeSlide{
	   background: #dd0083 url(LOCATION-OF-YOUR-HOVER-IMAGE) no-repeat;
	}
	

[danielgreencharternet 0]

Hi Jimmy, You guys are great. This worked. I just had to hide the numbers that showed when activation the play pause button, which I did.Doing the autoplay makes the goats march along. Goofy idea but you made it work, she will be happy-thanks!