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.

Toolbar icons not working properly?

3 posters

Go down

Solved Toolbar icons not working properly?

Post by Mimóza December 19th 2015, 12:43 pm

Hi... agian,
Geez, sorry for the flood of problems lately, but I'm such a noob. Toolbar icons not working properly? 1f631 
SO, I tried to change the toolbar icons, but as usually, I must have messed up something.
In the end, I changed so many things, they don't work and 2 icons can be seen for 1 button at the same time. Toolbar icons not working properly? 1f610 
Toolbar icons not working properly? Du

Codes I use:
JS:


CSS:


Any tips to make them work properly?
In addition, could a hover effect be added to them? http://ianlunn.github.io/Hover/ (Radial In - (#23799c))

Thanks in advance!  Toolbar icons not working properly? 1f601


Last edited by Mimóza on December 20th 2015, 4:10 pm; edited 1 time in total
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 19th 2015, 1:41 pm

Hey Very Happy
The problem of multiple picture was that you added image to default buttons again via JavaScript. That shouldn't be done since there is already image before.
So replace the JS by this
Js:

And for the CSS, you need to use
Code:
!important
to override the default image.
So use this
css:


Apply these codes and let me know if you need any help with positioning. Smile
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Mimóza December 19th 2015, 3:29 pm

Thanks, but now apart from the Pinterest and Reddit icons all of them are gone. Toolbar icons not working properly? 1f601
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 20th 2015, 2:11 pm

Oops I forgot to reposition the background image XD

Add this in your CSS
Code:
#fa_fb {
  width:25px;
  height:25px;
  background-image:url('http://i1370.photobucket.com/albums/ag257/AppleDrink/fbi_1.png')!important;
  background-repeat: no-repeat;
  background-postition: 0px!important;
}
#fa_twitter {
  width:25px;
  height:25px;
  background-image:url('http://i1370.photobucket.com/albums/ag257/AppleDrink/twiti_1.png')!important;
  background-repeat: no-repeat;
  background-postition: 0px!important;
}
#fa_gp {
  width:25px;
  height:25px;
  background-image:url('http://i1370.photobucket.com/albums/ag257/AppleDrink/gpu_1.png')!important;
  background-repeat: no-repeat;
  background-postition: 0px!important;
}
#fa_mail {
  width:25px;
  height:25px;
  background-image:url('http://i1370.photobucket.com/albums/ag257/AppleDrink/emil_1.png')!important;
  background-repeat: no-repeat;
  background-postition: 0px!important;
}
#fa_rss {
  width:25px;
  height:25px;
  background-image:url('http://i1370.photobucket.com/albums/ag257/AppleDrink/rss_1.png')!important;
  background-repeat: no-repeat;
  background-postition: 0px!important;
}
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Mimóza December 20th 2015, 2:22 pm

Thank you! But something is still not okay, because the icons are not there. Smile
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 20th 2015, 2:27 pm

I have to say your forum's code are very messed. This rule is lying somewhere in your forum index that is over writing the css
Code:
#fa_twitter {
    background-position: -90px 0px;
}

I really suggest you to try and clean codes up.

But for now, you have to create a java script that will over write that rule, so go to
ACP > Modules > JavaScript Management > Create new
Tick in all pages
Code:
$(function() {
  $(document.body).append('<style>#fa_fb, #fa_twitter, #fa_gp, #fa_mail, #fa_rss {background-postition: 0px!important;}</style>');
});

this SHOULD fix it.
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Mimóza December 20th 2015, 2:40 pm

Sorry for the troubles!!! Toolbar icons not working properly? 1f623 Ya, I'm having a hard time finding things in the codes too, and tried to remove the unnecessary parts, but seems like many remained. Toolbar icons not working properly? 1f610 However, the thing you mentioned is nowhere in the codes. At least I cannot find them. And bad news... the JS didn't fix the problem. Toolbar icons not working properly? 1f631
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 20th 2015, 2:43 pm

Replace the script by this
Code:
$(function() {
  $(document.body).append('<style>#fa_fb, #fa_twitter, #fa_gp, #fa_mail, #fa_rss {background-position: 0px!important;}</style>');
});

I misspelled 'position' as 'postition' Razz
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Mimóza December 20th 2015, 2:49 pm

Toolbar icons not working properly? 323245330_Holy20Cow_answer_1_small 
It's working!! Thank you so much!!
Can I bother you with the second question?
In addition, could a hover effect be added to them? http://ianlunn.github.io/Hover/ (Radial In - (#23799c))

Or I had better be satisfied with the result and give up on the hover effect? Very Happy
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 20th 2015, 2:58 pm

So you want on hover it to become from pink to #23799c with radial in effect?
If so I think you need to make the background of the image you're using to transparent.
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Mimóza December 20th 2015, 3:46 pm

Yup, I wanted that. I thought you can have an effect that overwrites the color? 
Nevermind, I changed my mind, and don't want the effect. It would be too much. Very Happy 

Thanks for your help and time Rhino!  Toolbar icons not working properly? 1f600Toolbar icons not working properly? 270c
Mimóza
Mimóza
Forumember

Female Posts : 676
Reputation : 278
Language : Hungarian, English

https://graphicballoon.forumotion.com/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by Rhino.Freak December 20th 2015, 5:56 pm

lol well whatever you wish XD
Glad to be of help Smile
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

Solved Re: Toolbar icons not working properly?

Post by brandon_g December 20th 2015, 8:09 pm

Thanks for the help Rhino!

Topic solved and archived ~ brandon_g

Happy holidays rendeer .


Toolbar icons not working properly? Brando10
Remember to mark your topic Toolbar icons not working properly? Solved15 when a solution is found.
General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

Toolbar icons not working properly? Scre1476
Team Leader
Review Section Rules | Request A Review | Sticker Points
brandon_g
brandon_g
Manager
Manager

Male Posts : 10106
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Back to top

- Similar topics

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