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.

I need 2 codes

View previous topic View next topic Go down

I need 2 codes

Post by The Pked on June 16th 2010, 5:53 pm

1. How do I make the navigation bar image lighten when the mouse hovers over it?

2. How do I make the corner of my background color circled?

http://www.theigraphics.info

The Pked
Forumember

Male Posts : 187
Reputation : 0
Language : English

http://www.theigraphics.info/

Back to top Go down

Re: I need 2 codes

Post by The Pked on June 17th 2010, 9:46 pm

bump

The Pked
Forumember

Male Posts : 187
Reputation : 0
Language : English

http://www.theigraphics.info/

Back to top Go down

Re: I need 2 codes

Post by andriyleu on June 17th 2010, 10:13 pm

Wait 24 hrs for evry "Bump"

andriyleu
New Member

Posts : 19
Reputation : 0
Language : Spanish

Back to top Go down

Re: I need 2 codes

Post by crysis992 on June 18th 2010, 12:04 am

Answer for your first question:

You have to do it with CSS.

Put your normal navigation in the CSS and remove the navigation images from:
Display-Pics management

Here is a example code for the search button in your navigation:

Code:

/* Normal navigation */
#i_icon_mini_search{
background-image:url(URL FOR THE NORMAL IMAGE)
width: **px
height: **px
}

/*  navigation hover */
#i_icon_mini_search:hover{
background-image:url(URL FOR THE HOVER IMAGE)
width: **px
height: **px
}

replace the **px with the height and width of your image.

Do you mean that?

you also can try the hover effect with opacity then you have to use this CSS codes:

Code:
    filter:alpha(opacity=70);
  -moz-opacity:0.7;
  -khtml-opacity: 0.7;
    opacity: 0.7;

i dont know if the Opacity css codes work in the Internet Explorer, i tested it only with Firefox.

crysis992
Forumember

Posts : 67
Reputation : 0
Language : German

Back to top Go down

Re: I need 2 codes

Post by The Pked on June 18th 2010, 7:00 pm

Didn't work, sorry Sad

Btw, I need the opacity changed when the mouse is over the navigation bar image.

The Pked
Forumember

Male Posts : 187
Reputation : 0
Language : English

http://www.theigraphics.info/

Back to top Go down

Re: I need 2 codes

Post by Cool-processor on June 18th 2010, 7:49 pm

I can make that for ya!

Code:
/* Menu-------------------------------------------------*/
.navbar {
}
ul.linklist li a img {
filter:alpha(opacity=20);
-moz-opacity: 0.5;
opacity: 0.3;
}
ul.linklist li a img:hover {
filter:alpha(opacity=100);
-moz-opacity: 2.0;
opacity: 1.9;
position: relative;
cursor:allowed;
}

#page-header #search-box {
display: none;
}

Change opacities etc with whatever you like Wink

Cool-processor
Forumember

Male Posts : 724
Reputation : -55
Language : HTML | CSS/3 | JQuery
Location : To my own coding world

http://www.creative-labz.com

Back to top Go down

Re: I need 2 codes

Post by ankillien on June 19th 2010, 8:21 am

Hello,

TO make nav bar light up when mouse over, navigate to Admin CP > display > colors > css
Add this code there and submit...

Code:
a.mainmenu {
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}
a.mainmenu:hover {
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity:1;
}

ankillien
Energetic

Posts : 5198
Reputation : 129
Language : English, XHTML, CSS, JS, PHP, SQL

http://www.webartzforum.com/

Back to top Go down

Re: I need 2 codes

Post by CraZyWolf on June 19th 2010, 8:55 am

@ankillien wrote:TO make nav bar light up when mouse over, navigate to Admin CP > display > colors > css
Add this code there and submit...

Code:
ul.linklist li a img {
filter:alpha(opacity=20);
-moz-opacity: 0.5;
opacity: 0.3;
}
ul.linklist li a img:hover {
filter:alpha(opacity=100);
-moz-opacity: 2.0;
opacity: 1.9;
position: relative;
cursor:allowed;
}

this code will help you i use it on my site and it work Smile

CraZyWolf
Forumember

Male Posts : 562
Reputation : 5
Language : HTML || CSS (learning) || Graphic Design ... can u guys stop sending me pms about gfx request cuz im not staff here.
Location : Los Angeles -LA-

Back to top Go down

Re: I need 2 codes

Post by TanMan77777777 on June 19th 2010, 9:22 am

For rounded corners (Does not work in IE):

Code:
.bodyline{
-webkit-border-radius:15px;
-moz-border-radius:15px;
border-radius:15px; /*For future*/
}

Change the 15px if you want it rounded more or less.

TanMan77777777
Forumember

Posts : 728
Reputation : 7
Language : English, HTML, CSS

http://tanman.forumakers.com

Back to top Go down

Re: I need 2 codes

Post by Cool-processor on June 21st 2010, 1:51 pm

Thats CSS3 isnt it? Very Happy

Cool-processor
Forumember

Male Posts : 724
Reputation : -55
Language : HTML | CSS/3 | JQuery
Location : To my own coding world

http://www.creative-labz.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