Jump to content
cadmin

How to change the Slider Play/Pause Button Color

Recommended Posts

cadmin

Anyone know how to change the color of the Feature Slider Play/Pause Button?

Share this post


Link to post
Share on other sites
WebWerx
This one?: http://cl.ly/1W2k2N3O2l3540163m0F It's an image file located within the theme. You can find it here: /images/feature-pause.png You would have to edit it with Photoshop or an equivalent App.

Share this post


Link to post
Share on other sites
WebWerx
Only if I am correct @catrina... only if I am correct.

Share this post


Link to post
Share on other sites
catrina
I double checked and your solution is correct. The image background is transparent, so that background color can be controlled by CSS styling, but the image itself can be edited and the background color can be included in it. @cadmin will need to use CSS to implement the image, though, and Firebug can help with that. It's available for download here: http://getfirebug.com. A tutorial on how to use it for CSS customization is here: http://www.pagelines.com/wiki/Custom_CSS#How_to_use_CSS_Inspection_Tools.

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
cadmin
firebug seems to mess with google chrome... is there another tool that doesn't?...

Share this post


Link to post
Share on other sites
cadmin
nevermind. I see they reference that the google tool is built in. i'll give it a shot!

Share this post


Link to post
Share on other sites
cadmin
I tried both these parts of the code but saw no difference... hints are appreciated. thx } media="all" #featurenav a, #feature-footer span.playpause { border: 1px solid #003352; border-right-width: 1px; border-bottom-width: 1px; border-right-style: solid; border-bottom-style: solid; border-right-color: #003352; border-bottom-color: #003352; border-left: 1px solid #003352; border-left-width: 1px; border-left-style: solid; border-left-color: #003352; border-top: 1px solid #003352; border-top-width: 1px; border-top-style: solid; border-top-color: #003352; } media="all" .tcolor#003352, .lcolor3 a, .main_nav li a, .widget-title a, h3.widget-title a, #subnav_row li a, .metabar em, .metabar a, .tags, #commentform label, .form-allowed-tags code, .rss-date, #breadcrumb, .reply a, .post-nav a, .post-nav a:visited, .post-footer, .auxilary a, #buddypress-page .standard-form .admin-links a, #twitterbar .content .tbubble, .widget ul.twitter .twitter-item, .cform .emailreqtxt, .cform .reqtxt, #pagination .wp-pagenavi a, #pagination .wp-pagenavi .current, #pagination .wp-pagenavi .extend, .main_nav ul.sf-menu a, .sf-menu a:visited, #featurenav a, #feature-footer span.playpause { color: #003352; }

Share this post


Link to post
Share on other sites
Danny
Hi Cadmin, Please try the below code. [code]#feature-footer span.playpause { background-color: black !important; }[/code]

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
cadmin
Thank you. It works and I was able to place a custom color behind the button which makes it easier to discern as a button. Which begs the further question - how might I customize the play/pause button to display "play/pause" in a hover balloon? And, additionally, can the transparency of the button be changed to a color?

Share this post


Link to post
Share on other sites
catrina
You'll need a hover balloon image, which can be applied using the CSS attribute [b]background-image.[/b] By transparency of the button, do you mean the background's transparency?

Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


×