Do you remove your black bar?
This topic is part of our CSS Tutorials and Add-ons section: http://myanimelist.net/forum/?topicid=419405 I wrote some codes to remove the top black bar (circled above) or just make it transparent. TO REMOVE THE BLACK BAR Add the codes in this link to the bottom of your CSS edit box: TO MAKE THE BLACK BAR TRANSPARENT Add the codes in this link to the bottom of your CSS edit box: If you find your bar comes back, you must re-add the codes. |
Shishio-kunSep 1, 2016 9:12 PM
| hey shishi i'm back with another question! LOL the transparency code above isn't working because of the header codes right? last time you did something to make it work but the backgrounds are not matching up. how can i fix it? thanks again dude! Happy Halloween! @_@ |
 |
Den-kun said: the transparency code above isn't working because of the header codes right? last time you did something to make it work but the backgrounds are not matching up. how can i fix it? No, they work. I tested it out on your CSS just now and it worked as its supposed to. This shouldn't have anything to do with header codes atm. Try adding the code I listed at the bottom of the post- body, #mal_cs_listinfo, #mal_cs_links, #mal_cs_otherlinks { background-position: top center !important; } along with all the other codes and changes in the post. that's necessary to make the backgrounds match up in your case, its probably whats needed. |
Shishio-kunNov 4, 2011 3:01 PM
| thanks shishi. it's working now, although there's still a little piece of the black bar left on the right corner of the screen. LOL i replaced the old code "tbody, body" before. that seems to be the problem why the black header returned when i used the codes for the headers. anyway, thanks again for answering all my questions. you rock! @_@ |
|
Den-kun said: thanks shishi. it's working now, although there's still a little piece of the black bar left on the right corner of the screen. LOL i replaced the old code "tbody, body" before. that seems to be the problem why the black header returned when i used the codes for the headers. anyway, thanks again for answering all my questions. you rock! @_@ You don't have this code in your CSS: #mal_cs_pic, #mal_cs_listinfo, #mal_cs_links { border-right: 0 none !important; } thats for removing the little piece |
Shishio-kunNov 4, 2011 3:01 PM
| i already put that code in my CSS but it's still there shishi. @_@ |
|
Den-kun said: i already put that code in my CSS but it's still there shishi. @_@ It wasn't there when I looked at it earlier but I see the code at the bottom now and the little piece I'm talking about is gone- maybe your thing is just updating slow for some reason. Give it a half day or log in/out, maybe reset com and it should come up gone. But I would leave your CSS alone cuz its how its supposed to be now from what I see. |
| alright shishi thanks a lot! maybe it's just updating slowly. LOL thanks again dude! |
|
| Instead of making it full transparent, isn't there a way to add transparent-color code? Thanks. |
     |
Naruto2700 said: Instead of making it full transparent, isn't there a way to add transparent-color code? Thanks. Naruto2700 said: Instead of making it full transparent, isn't there a way to add transparent-color code? Thanks. I don't think so. I think I had to do it this way because that wasn't possible here. Even so, I believe the result is the same as if you were able to add transparent color anyhow. |
| Hm... this is cool but is there really no other way to return back to your profile? LOL |
 |
OriginANIME said: Hm... this is cool but is there really no other way to return back to your profile? LOL Back/return key on your browser's navigation toolbar will return you back if you removed the menu bar. If you can't see back/return it might be unchecked but you can recheck it under view > toolbars And when you make your menu bar transparent you can still click the usual menu bar options. Though maybe I could write a code where the rest of the bar is removed but you are left with a single button that returns you to your profile. |
Shishio-kunDec 2, 2011 8:16 PM
Shishio-kun said: OriginANIME said: Hm... this is cool but is there really no other way to return back to your profile? LOL Though maybe I could write a code where the rest of the bar is removed but you are left with a single button that returns you to your profile. Yeah would be nice if it still had its "return to profile" option and the "add animes/mangas to your list" option. If you could implement that, it would be pretty dam awesome! :D |
|
Naruto2700 said: Instead of making it full transparent, isn't there a way to add transparent-color code? Yes there is a way. Two ways actually. I did it on my list. 1. You can set rgba color and define the procentage of transparancy you want. CSS3 magic, will NOT work in old browsers. But with firefox/chrome/safari/opera you should be alright. An example of rgba color code: #mal_control_strip { background-color: rgba(83, 83, 83, 0.83); } The first three parameters are indications of what color you are currently using as with standard rgb color. White being 255, 255, 255. Standard colors in css are written in hex, for example #ffffff for white. If you need more help with getting the color you want in rgb instead of hex just go to http://hex2rgba.devoth.com The fourth parameter (0.83 in my code example above) indicates how much transparancy the color will be. Just change the number if you want more or less transparancy. 2. Use a transparent image as a background for the black bar. Safer technique, works in all browsers. It's just a simple transparent bar I uploaded to imgur. Feel free to use it if you want. Remember that this image should only be the background for "the black bar" and not on the body! #mal_control_strip { background-color: transparent !important; background-image: url(http://i.imgur.com/fv1Pc.png) !important; } One of those should get the job done. |
jnsnlssn said: Naruto2700 said: Instead of making it full transparent, isn't there a way to add transparent-color code? Yes there is a way. Two ways actually. I did it on my list. 1. You can set rgba color and define the procentage of transparancy you want. CSS3 magic, will NOT work in old browsers. But with firefox/chrome/safari/opera you should be alright. An example of rgba color code: #mal_control_strip { background-color: rgba(83, 83, 83, 0.83); } The first three parameters are indications of what color you are currently using as with standard rgb color. White being 255, 255, 255. Standard colors in css are written in hex, for example #ffffff for white. If you need more help with getting the color you want in rgb instead of hex just go to http://hex2rgba.devoth.com The fourth parameter (0.83 in my code example above) indicates how much transparancy the color will be. Just change the number if you want more or less transparancy. 2. Use a transparent image as a background for the black bar. Safer technique, works in all browsers. It's just a simple transparent bar I uploaded to imgur. Feel free to use it if you want. Remember that this image should only be the background for "the black bar" and not on the body! #mal_control_strip { background-color: transparent !important; background-image: url(http://i.imgur.com/fv1Pc.png) !important; } One of those should get the job done. Thanks for the input, but I used both of these techniques on the beginner's premade layout, and they both didn't work. Its because the #mal_control_strip you posted is blocked by the site after you save it. I would have used that before if it were that easy. But then I noticed it worked on your own layout- this is because in your code you have #mal\_control\_strip instead of#mal_control_strip. This appears to let you bypass the site's restrictions. Pretty cool! I didn't know we could do this. This will make it simpler to turn the bar it transparent, and enhance translucency options, thanks. |
| Major updates, much easier now and there's a link to a menu bar customization thread now. Thanks, Jnsnlssn for the easier method. |
| Wow 2010? Anyways this topic's been restored to functionality. |
More topics from this board
» theme helpthreat - Jul 5 |
5 |
by Zaryf
»»
Aug 21, 5:46 AM |
|
» [CSS - Modern] 🍰 Clarity by V.L ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Apr 19, 2018 |
1261 |
by KiranaStarr
»»
Aug 16, 5:48 PM |
|
» [CSS] ⭐️ Customize your List Cursor + Cursor FixesShishio-kun - Mar 8, 2021 |
30 |
by Shishio-kun
»»
Jul 28, 3:17 AM |
|
» How To Have Different Banner/Cover image & Background Image For Manga & Anime ListsYasminaRegina - Jul 25 |
2 |
by YasminaRegina
»»
Jul 26, 1:02 AM |
|
Sticky: » 💚 [REPAIR STICKY] Repair/speed up layouts + Request layout fixes ( 1 2 )Shishio-kun - Nov 17, 2023 |
52 |
by LucaBalsa
»»
Jul 6, 2:02 PM |