The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

NavButton hover image

4 posters

Go down

In progress NavButton hover image

Post by Macca_96 Fri 15 Mar - 16:52

Im trying to create rollover images for my navbar buttons. Each button hover image will be different.

What are the selectors in each one(Forum, Register, Profile etc)?


http://apexevolution.forumotion.com
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by levy Fri 15 Mar - 16:56

Hello , you will find all in that post : https://help.forumotion.com/t119328-blue-hover-navbar

levy
levy
Hyperactive

Male Posts : 2632
Reputation : 350
Language : English, Romanian
Location : Romania

https://portofolio.goodforum.net/

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Fri 15 Mar - 18:35

Ok now i have added new buttons, the bar is on 2 lines and there is no "force navbar to be on 1 line" option (i thought there would be) Sad How can i force that?
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Derri Fri 15 Mar - 19:30

Can you provide a link to your forum please?

Have you tried centering the navbar?

Derri
Derri
Helper
Helper

Male Posts : 8755
Reputation : 638
Language : English & Basic French
Location : Scotland, United Kingdom

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Fri 15 Mar - 19:53

The link is in my opening post and the bar is set to centre. btw im still having trouble with the hover images

EDIT: When I enter images directly into the css after deleting images in the Headers and Navagation tab, I can see the name of the link (the "alt"(i think its the alt or name))
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Sanket Fri 15 Mar - 22:39

On your forum, the hover seems to be working fine. What is the problem? That all the images are not in one line? Well if the width of the image itself is too big, then it will go onto the next line probably. Decrease the width of the images then.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Sat 16 Mar - 0:09

You havent seen the problem cause i set it back to how it was. The problem was in the edit I did in my previous post
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Sanket Sat 16 Mar - 0:12

Please provide the codes you added on your forum & also put them on your forum, so we see what the problem is.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Sat 16 Mar - 2:56

Code:

 #i_icon_mini_index{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/001ind11.png) no-repeat 0 0;}
    #i_icon_mini_index:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/101ind11.png) no-repeat 0 0;}
 
    #i_icon_mini_faq{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/008faq10.png) no-repeat 0 0;}
    #i_icon_mini_faq:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/108faq10.png) no-repeat  0 0;}
   
#i_icon_mini_search{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/009sea10.png) no-repeat 0 0;}
    #i_icon_mini_search:hover{background:url(http://i74.servimg.com/u/f74/18/06/14/84/109sea10.png) no-repeat  0 0;}
   
#i_icon_mini_members{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/002mem10.png) no-repeat 0 0;}
    #i_icon_mini_members:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/102mem10.png) no-repeat  0 0;}
   
#i_icon_mini_groups{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/003use10.png) no-repeat 0 0;}
    #i_icon_mini_groups:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/103use10.png) no-repeat  0 0px;}
#i_icon_mini_profile{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/004edi10.png) no-repeat 0 0;}
    #i_icon_mini_profile:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/104edi10.png) no-repeat  0 0;}
#i_icon_mini_message{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/005mes10.png) no-repeat 0 0;}
    #i_icon_mini_message:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/105mes10.png) no-repeat 0 0;}

    #i_icon_mini_logout{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/th/010log10.png) no-repeat 0 0;}
    #i_icon_mini_logout:hover{width:144px;height:22px;background:url(http://i74.servimg.com/u/f74/18/06/14/84/110log10.png) no-repeat  0 0;}

http://apexevolution.forumotion.com/

As you can see the image sizes are all funny for some reason. I want them all the same size as the hover. But the index is working correctly :/

h and i got 2 custom buttons there too. How do i add them?
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Sanket Sat 16 Mar - 6:24

Image sizes are funny, because the actual image url size are varying.

About custom navigations, can you add a image first. I see only text there.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Sat 16 Mar - 16:58

The roller images are the same dimension to the regular images so I dont know what is going on there.

I need to know what selectors to use for the custom images so I can add them to the style sheet
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Sanket Sun 17 Mar - 2:04

There are no selectors for the custom images that you add in the navigation bar.
https://help.forumotion.com/t105986-a-hover-on-a-custom-navigation-bar-button#691930
That would have probably worked, if the url were from the forum itself & not from youtube as it is on your forum currently.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

In progress Re: NavButton hover image

Post by Macca_96 Sun 17 Mar - 2:21

Oh bummer.

As for the sizing, we managed to fix that just wish we could use the same effect on the custom links.
avatar
Macca_96
Forumember

Posts : 232
Reputation : 0
Language : English

Back to top Go down

In progress Re: NavButton hover image

Post by Sanket Sun 17 Mar - 2:23

I was trying to find a fix, couldn't find one.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Back to top


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