The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

nice buttons

View previous topic View next topic Go down

Solved nice buttons

Post by Guest on 18/2/2012, 16:30

how i create buttons like these --> ??

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Nera. on 18/2/2012, 17:14

Please post a link to the page where you saw those buttons. What is it? Tabs, navi? Where do you want them? A bit more info would do great.
avatar
Nera.
Energetic

Female Posts : 7078
Reputation : 2014
Language : English
Location : -

http://webartzforum.com

Back to top Go down

Solved Re: nice buttons

Post by Guest on 18/2/2012, 19:05


The buttons are yellow (whatever color basically want) and when you click become darker, yellow-gray and finally black. It's menu.

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Guest on 22/2/2012, 11:09

bump Smile

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Guest on 24/2/2012, 15:36

bump .. bump ... = spam... Smile

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by BryanR on 25/2/2012, 01:46

Hmmm, what are you asking exactly? Are you asking for a code to create a type of tab, etc. Or are you are asking for a graphic which by the way goes here, Graphic Requests? Please provide more information, no one can provide assistance if not enough information about the problem or what you need help on is provided. Wink

BryanR
Forumember

Male Posts : 185
Reputation : 10
Language : English | Spanish | Spanglish | HTML | Graphics
Location : Support Forum@Forumotion.com

Back to top Go down

Solved Re: nice buttons

Post by Nera. on 25/2/2012, 08:21

Respect_Me wrote:
The buttons are yellow (whatever color basically want) and when you click become darker, yellow-gray and finally black. It's menu.

Please post a link to the page where you saw those buttons. Wink
avatar
Nera.
Energetic

Female Posts : 7078
Reputation : 2014
Language : English
Location : -

http://webartzforum.com

Back to top Go down

Solved Re: nice buttons

Post by Omu on 25/2/2012, 10:39

HTML Code:

Code:
<div class="menu-lol">
<a href="link">Link</a>
<a href="link">Link</a>
<a href="link">Link</a>
<a href="link">Link</a>
<a href="link">Link</a>
</div>

CSS Code:

Code:

.menu-lol {
border-radius: 3px 3px 3px 3px;
background: blue;
border: 1px solid darkblue;}

.menu-lol a{
color: #fff;}

.menu-lol a:hover {
border-radius: 4px 4px 4px 4px;
margin: 3px;
padding: 1px;
background: red;}

I don't tested it...
avatar
Omu
Active Poster

Male Posts : 1019
Reputation : 87
Language : Romanian, English, French
Location : Romania

http://supportdrops.com/

Back to top Go down

Solved Re: nice buttons

Post by Nera. on 25/2/2012, 19:19

I saw the site, it's just a background image added as a hover image too the navigation. Post your forum url, what do you have as navigation?

They used a box shadow for the hover & transition so it seems to you that it fades.

avatar
Nera.
Energetic

Female Posts : 7078
Reputation : 2014
Language : English
Location : -

http://webartzforum.com

Back to top Go down

Solved Re: nice buttons

Post by Guest on 25/2/2012, 20:08

Nera. my forum url is -> http://respect.forum6.info


Smile

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Guest on 26/2/2012, 15:54

Please , can you help me ?

Smile

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Nera. on 26/2/2012, 17:16

Please don't double/triple post. Your post need to be separated by 24 hours before bumping, replying or adding more information. Please use the edit button instead. Since that's your third reminder you got a warning for it.

Try it in AP > Display > Colors > CSS

Code:
#pun-navlinks a:hover {
    background: url("http://undersec.info/public/style_images/elegant/_custom/primarylink_hover.png") repeat-x scroll center top transparent;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    color: white !important;
    font-size: 1.15em;
    margin: 0 auto !important;
    padding: 5px;
}
#pun-navlinks a {
    -moz-transition: all 250ms ease 0s;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3);
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 5px 15px rgba(0, 0, 0, 0.4) inset;
    color: rgba(255, 255, 255, 0.6) !important;
    font-size: 1.15em;
    font-weight: bold;
    padding: 5px !important;
    text-decoration: none !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
}
#pun-navlinks li a {
    margin: 0 auto !important;
}
avatar
Nera.
Energetic

Female Posts : 7078
Reputation : 2014
Language : English
Location : -

http://webartzforum.com

Back to top Go down

Solved Re: nice buttons

Post by Guest on 26/2/2012, 17:33

Nera. thanks , works.

good job!
thumleft
Solved!

Guest
Guest


Back to top Go down

Solved Re: nice buttons

Post by Nera. on 26/2/2012, 17:35

Topic Solved & Locked
avatar
Nera.
Energetic

Female Posts : 7078
Reputation : 2014
Language : English
Location : -

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum