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.

Navbar code

Page 1 of 2 1, 2  Next

View previous topic View next topic Go down

Navbar code

Post by sgeorge on June 26th 2010, 4:11 pm

How can I create this effect on my navbar ?

http://radiosoundall.forumotion.com/index.htm?theme_id=155391

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 26th 2010, 5:54 pm

sgeorge its the same as i gave you by the PM. Smile

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 5:18 am

A.... Ok I asked because this colorizes the bar...

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Dumbledore27 on June 27th 2010, 5:39 am

For PhpBB 2:
Code:
a.mainmenu img {
-khtml-opacity : 0.7;
-moz-opacity : 0.7;
filter : alpha(opacity=100);
opacity : 0.7;
}
a.mainmenu:hover img {
-khtml-opacity : 1;
-moz-opacity : 1;
filter : alpha(opacity=70);
opacity : 1;
}
PhpBB 3:
Code:
ul.navlinks a img:hover {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}
Paste to CSS. ACP -> Display -> Colors -> CSS Stylesheet

I got this code from DustyBones' website.

Dumbledore27
Forumember

Male Posts : 632
Reputation : -3
Language : Online
Location : Error 403 - You do not have the permission to view this item's value

Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 7:54 am

I havw this code... My question is now.. How the buttons are colorized ? Becase this code just makes it transparent....


thank you for responding gangstar and Dumbledore27

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Dumbledore27 on June 27th 2010, 7:59 am

@sgeorge wrote:I havw this code... My question is now.. How the buttons are colorized ? Becase this code just makes it transparent....


thank you for responding gangstar and Dumbledore27
They will get colourized if you hoover them by mouse (it's called mouse-hoover or mouse-over effect).

Dumbledore27
Forumember

Male Posts : 632
Reputation : -3
Language : Online
Location : Error 403 - You do not have the permission to view this item's value

Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 4:06 pm

This justs makes transoparent the navbar and when you point it with the mouse,it gets normal... It doesn't change color.

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 4:08 pm

and in the site you wrote above it doesn't changes the colour Smile

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 5:21 pm

Look what I mean...


sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 5:30 pm

well i don't know what this called, so i cant help Smile

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 5:36 pm

ok thank you !

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 5:55 pm

Well i found the code! but it need some changes with the pictures.

Code:

div.maintitle{color: #000;}
#i_icon_mini_index{width:85px; height:32px; background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an10.png) no-repeat 0 0;}
#i_icon_mini_index:hover{background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an10.png) no-repeat 0 -32px;}
#i_icon_mini_portal{width:86px; height:32px; background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an13.png) no-repeat 0 0;}
#i_icon_mini_portal:hover{background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an13.png) no-repeat 0 -32px;}
#i_icon_mini_faq{width:86px; height:32px; background:url(http://i39.tinypic.com/2lcuwxk.png) no-repeat 0 0;}
#i_icon_mini_faq:hover{background:url(http://i39.tinypic.com/2lcuwxk.png) no-repeat 0 -32px;}
#i_icon_mini_search{width:86px; height:32px; background:url(http://i41.tinypic.com/b8vigp.png) no-repeat 0 0;}
#i_icon_mini_search:hover{background:url(http://i41.tinypic.com/b8vigp.png) no-repeat 0 -32px;}
#i_icon_mini_members{width:86px; height:32px; background:url(http://i42.tinypic.com/2uxve2q.png) no-repeat 0 0;}
#i_icon_mini_members:hover{background:url(http://i42.tinypic.com/2uxve2q.png) no-repeat 0 -32px;}
#i_icon_mini_groups{width:86px; height:32px; background:url(http://i41.tinypic.com/2j2vm6o.png) no-repeat 0 0;}
#i_icon_mini_groups:hover{background:url(http://i41.tinypic.com/2j2vm6o.png) no-repeat 0 -32px;}
#i_icon_mini_profile{width:86px; height:32px; background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an16.png) no-repeat 0 0;}
#i_icon_mini_profile:hover{background:url(http://i64.servimg.com/u/f64/13/24/64/14/bar_an16.png) no-repeat 0 -32px;}
#i_icon_mini_message{width:86px; height:32px; background:url(http://i43.tinypic.com/2wodc2q.png) no-repeat 0 0;}
#i_icon_mini_message:hover{background:url(http://i43.tinypic.com/2wodc2q.png) no-repeat 0 -32px;}
#i_icon_mini_new_message{width:86px; height:30px; background:url(http://i43.tinypic.com/2itstjo.png) no-repeat 0 0;}
#i_icon_mini_new_message:hover{ background:url(http://i43.tinypic.com/2itstjo.png) no-repeat 0 -32px;}
#i_icon_mini_logout{width:41px; height:32px; background:url(http://i42.tinypic.com/wu1fe8.png) no-repeat 0 0;}
#i_icon_mini_logout:hover{background:url(http://i42.tinypic.com/wu1fe8.png) no-repeat 0 -32px;}
#i_icon_mini_register{width:86px; height:32px; background:url(http://i40.tinypic.com/awrpjs.png) no-repeat 0 0;}
#i_icon_mini_register:hover{background:url(http://i40.tinypic.com/awrpjs.png) no-repeat 0 -32px;}
#i_icon_mini_login{width:41px; height:32px; background:url(http://i44.tinypic.com/10nb8xy.png) no-repeat 0 0;}
#i_icon_mini_login:hover{background:url(http://i44.tinypic.com/10nb8xy.png) no-repeat 0 -32px;}


I think you or im sure, your navbar pictures must be like this.
and delete them from the pics managements.


Last edited by Gangstar15 on June 27th 2010, 6:08 pm; edited 1 time in total

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 6:03 pm

Yeah ! I think that works if you have the navbar turned off and if you change on the code the image's URLs...

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 6:04 pm

yes so you said that you are a graphic designer xD so make your new navbar like the image above. ;D

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 6:12 pm

@Gangstar15 wrote:yes so you said that you are a graphic designer xD so make your new navbar like the image above. ;D

Yeah ! I will ! But....tommorow because I've just formated my PC and I have to reinstall PS... Very Happy


P.S. : You should be staff right here Wink


Last edited by sgeorge on June 27th 2010, 6:14 pm; edited 1 time in total

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 6:13 pm

Okay d; maybe i will do a set too, but .........tomorrow xD lol ^^

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 6:14 pm

You should be staff right here Very Happy .... You help so much everyone !

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 6:17 pm

Haha ty ty Wink. but who will accept me ^_^

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 6:19 pm

The have to... You are almost always ONLINE and you help everywhere you can ! Why don't you make a request ?

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 6:20 pm

haha yes im almost 24 hr online xD. and another one told me the same ;D . i will try this out. ;P

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 27th 2010, 6:35 pm

Question !

I have to create to images and put them in one ? Like this ? → http://i64.servimg.com/u/f64/13/24/64/14/bar_an10.png

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by Guest on June 27th 2010, 10:07 pm

Yes! Wink

Guest
Guest


Back to top Go down

Re: Navbar code

Post by sgeorge on June 28th 2010, 8:18 am

Yeah Ok... I started creating the navbar but a have a dificulty in creating the glow - flash that has the 2nd image... Like that →

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by SiKiN on June 28th 2010, 8:50 am

Using Blending options you can set an Inner Glow from the center of the image.

SiKiN
Forumember

Posts : 62
Reputation : 0
Language : english

Back to top Go down

Re: Navbar code

Post by Guest on June 28th 2010, 9:12 am

Good idea SiKiN Wink

Guest
Guest


Back to top Go down

Re: Navbar code

Post by [GM]DoubleAgent on June 28th 2010, 9:48 am

If you can make that, can u make one for me?! My forum is progameshacking.forumotion.com Very Happy

[GM]DoubleAgent
Forumember

Male Posts : 340
Reputation : 0
Language : Arabic

http://progamescheating.forumotion.com

Back to top Go down

Re: Navbar code

Post by Guest on June 28th 2010, 9:52 am

well its easy just make nav bar and use the code above xD

Guest
Guest


Back to top Go down

Re: Navbar code

Post by SiKiN on June 28th 2010, 10:05 am

Draw a square, right click the layer and hit blending options.

Tick the box that says Bevel.

Button done!

SiKiN
Forumember

Posts : 62
Reputation : 0
Language : english

Back to top Go down

Re: Navbar code

Post by sgeorge on June 28th 2010, 10:09 am

Yes it is done ! Thank you all for the instructions !

sgeorge
Forumember

Male Posts : 556
Reputation : 15
Language : Greek - English
Location : Greece

Back to top Go down

Re: Navbar code

Post by [GM]DoubleAgent on June 28th 2010, 10:11 am

yeap, but, here the photoshop have a bug..

I make that text box and start writing..

Nothing is there, but the layer's name is renamed to what i wrote...

Do you find a solution for that?!

[GM]DoubleAgent
Forumember

Male Posts : 340
Reputation : 0
Language : Arabic

http://progamescheating.forumotion.com

Back to top Go down

Page 1 of 2 1, 2  Next

View previous topic View next topic Back to top


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