Jump to content
Sign in to follow this  
tippytap

Show play/pause button on feature slider without navigation bar

Recommended Posts

tippytap

The navigation bar is taking up valuable screen space so I going to check 'no navigation' on the feature navigation mode. But I'd like to have the play/pause button show up directly on the feature slider. Can someone tell what the code might be to do this and WHERE I should put it[? I'm a newbie here but have been cutting and pasting code from various questions on this forum quite successfully so I'm thankful to all the experts out there! Thanks! Screenshot attached:LKPy9

Share this post


Link to post
Share on other sites
cmunns

Sowmya. Probably try adding the featurenav, then adding some css. Get comfortable using a browser developer tool, but for now try this css ` #featurenav {display:none;} span.playpause {position:relative;top:-30px;} `

Share this post


Link to post
Share on other sites
tippytap

Adam, thanks! The play button code worked great. But the first line of code just made the nav bar blank. It didn't actually take it out. I tried to adjust the height of the nav bar as a workaround but it didn't work. Ideas would be appreciated. And how would I adjust the color of the play button (it's hot pink right now which doesn't match the site at all!) (see www.tippytap.org for what it looks like now).

Share this post


Link to post
Share on other sites
bryan-hadaway

Actually, it might just be a matter if adjusting the #feature height to close up that area. Also, you're site is in maintenance mode so we can't see. Thanks, Bryan

Share this post


Link to post
Share on other sites
tippytap

I tried adjusting the feature height but it only tweaks the picture size and leaves the nav bar alone. Would appreciate more ideas - we're launching on World Water Day on March 22nd. And here is a screenshot for more clarity: LKPy9.png Thanks.

Share this post


Link to post
Share on other sites
cmunns

If it left it blank you would have to identify the other selectors and css rules that give it backgrounds and borders to make it transparent. Hard for us to help without that live link though. Have you tried using the Chrome toolbar or Firebug to help yourself.?

Share this post


Link to post
Share on other sites
tippytap

Thanks. I am trying to use Firebug but it's taking a while since I'm so new. Actually spent more time yesterday trying to undo my edits rather than moving forward on this! Took the maintenance plug in off. Could you take a look now and recommend some code to get rid of the nav bar (either by adjusting the height or turning it transparent)? Really trying to launch this in a few days in time for World Water Day! Much appreciated! And you can find the live site at www.tippytap.org Thanks!

Share this post


Link to post
Share on other sites
cmunns

Sowmya, sorry about that I'm on the forums about this same time each day. Do you have credentials to get through the splash page? `#feature-footer {background:transparent;}` should work.

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

Sign in to follow this  

×