GameBanana shows no ads to members. Sign up now!
Ads keep us online. Without them, we wouldn't exist. We don't have paywalls or sell mods - we never will. But every month we have large bills and running ads is our only way to cover them. Please consider unblocking us. Thank you from GameBanana <3

Important Links Repositioned w/ Slide-Out Effect

A Config Script for GameBanana

21 428 bytes Raw Code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
#ImportantLinks
{
        position : fixed;
        bottom   : 0;
        right    : 0;
        z-index  : 7;
}

#ImportantLinks li
{
        --LI_PaddingLeft  : 1em;
        --SpriteIcon_Size : 16px;
        transform         : translateX(calc(100% - var(--LI_PaddingLeft) - var(--SpriteIcon_Size)) - 1ch);
        transition        : transform .5s ease-in-out;
}

#ImportantLinks li:hover
{
        transform  : translateX(0);
        transition : transform .2s ease-in-out;
}

Updates

1.6 5mo
  • Improvement Use a calculation function for accurate repositioning.
1.5 2y Improvement BugFix 1.4 2y Tweak 1.3 2y Overhaul 1.2 4y

Summary

This is a cool effect which repositions the important links (Chat, Feedback, Support, Bugs) so that only their icons are visible. Hovering on the icons will make the link slide out and make the corresponding text visible.

Preview



Sign up to access this!
  • Danial Zahid avatar
    Danial Zahid username pic Joined 7y ago
    Bug Zapper Ripe Supporter Baldi Manager GoldSrc Manager Moderator
    Offline
    5,273 points Ranked 1316th
    62 medals 5 legendary 17 rare
    • Submitted 50 Gamefiles Medal icon
    • Submitted 15 Tools Medal icon
    • Submitted 60 Prefabs Medal icon
    • Returned 5000 times Medal icon
    • Became a Ripe Supporter Medal icon
    • 50 posts awarded Exemplary Feedback Medal icon
    Danial Zahid avatar
    Danial Zahid
    Bug Zapper
    access_time 2y edit 2y
    Neat.
    Although, currently the icons are not visible when the SideNav is on the right side, making them almost unnoticeable.

    URL to post:
  • |Anonymous| avatar
    |Anonymous| Joined 4y ago
    pretty shut!!
    Mimics Flag Affiliation: Mimics
    212 points Ranked 56397th
    |Anonymous| Mimics Flag
    Affiliation
    Mimics
    access_time 4y
    Cool
    Anonymous Killer avatar
    Mantra
    Anonymous Killer
    URL to post:
  • Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage username pic Joined 9y ago
    (づ。◕‿‿◕。)づ Ripe Supporter Moderator
    Coding
    5,366 points Ranked 1282nd
    76 medals 11 legendary 20 rare
    • Submitted 60 Sprites Medal icon
    • Thanked 500 submitters Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
    • Submitted 100 Skins Medal icon
    • Reached 100 subscribers Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
    Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage
    (づ。◕‿‿◕。)づ
    access_time 4y
    Posted by Ezequiel-TM

    It seems useful!
    Thanks!

    Erode using Code
    URL to post:
  • Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage username pic Joined 9y ago
    (づ。◕‿‿◕。)づ Ripe Supporter Moderator
    Coding
    5,366 points Ranked 1282nd
    76 medals 11 legendary 20 rare
    • Submitted 60 Sprites Medal icon
    • Thanked 500 submitters Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
    • Submitted 100 Skins Medal icon
    • Reached 100 subscribers Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
    Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage
    (づ。◕‿‿◕。)づ
    access_time 4y
    Posted by Ezequiel-TM

    It seems useful!
    Thanks!
    Erode using Code
    URL to post:
  • Ezequiel-TM avatar
    Ezequiel-TM username pic Joined 6y ago
    MUGEN Manager HL Manager SC Manager CS1.6 Manager CS:CZ Manager Moderator
    you do not see
    Life Tree Flag Affiliation: Life Tree
    7,782 points Ranked 832nd
    53 medals 6 legendary 14 rare
    • Submitted 100 Skins Medal icon
    • 30 submissions featured Medal icon
    • 2017 Top Contributor Medal icon
    • Returned 5000 times Medal icon
    • Submitted 50 Maps Medal icon
    • Reached 100 subscribers Medal icon
    Ezequiel-TM avatar
    Ezequiel-TM
    Life Tree Flag
    Affiliation
    Life Tree
    access_time 4y
    It seems useful!
    Synonym of quality avatar
    Mantra
    Synonym of quality
    URL to post:
  • Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage username pic Joined 9y ago
    (づ。◕‿‿◕。)づ Ripe Supporter Moderator
    Coding
    5,366 points Ranked 1282nd
    76 medals 11 legendary 20 rare
    • Submitted 60 Sprites Medal icon
    • Thanked 500 submitters Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
    • Submitted 100 Skins Medal icon
    • Reached 100 subscribers Medal icon
    • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
    Ring-A-Ding Rampage avatar
    Ring-A-Ding Rampage
    (づ。◕‿‿◕。)づ
    access_time 4y
    Posted by -=$|TAGAMTAM|$=-
    Thanks for the heads up. I updated it now and optimized the selectors as well.
    Erode using Code
    URL to post:
  • -=$|TAGAMTAM|$=- avatar
    -=$|TAGAMTAM|$=- username pic Joined 6y ago
    ❤ LOVING ME ❤
    Filipino Makers Flag Affiliation: Filipino Makers
    2,704 points Ranked 20057th
    31 medals 1 legendary 7 rare
    • Submitted 100 Skins Medal icon
    • 2nd Place - Site Improvement Ideating Contest Medal icon
    • Submitted 5 Tools Medal icon
    • 10 submissions featured Medal icon
    • Returned 1000 times Medal icon
    • 3rd Place - Game Poetry Contest Medal icon
    -=$|TAGAMTAM|$=- avatar
    -=$|TAGAMTAM|$=-
    Filipino Makers Flag
    Affiliation
    Filipino Makers
    access_time 4y
    Hello, umm I just wanna say that the script needs to be updated since tom added a new important link--the Chat. I've edited it myself and see how it looks now ..

    /*** Adjust Links' Position Individually ***/

    #ImportantLinks > li:nth-child(1)
    {
             bottom                  : 140px;
    }

    #ImportantLinks > li:nth-child(2)
    {
             bottom                  : 105px;
    }

    #ImportantLinks > li:nth-child(3)
    {
             bottom                  : 70px;
    }

    #ImportantLinks > li:nth-child(4)
    {
             bottom                  : 35px;
    }

    King of the Hill avatar
    Mantra
    King of the Hill
    URL to post:

Embed

Share banner
Image URL
HTML embed code
BB embed code
Markdown embed code

Credits

Key Authors
Ring-A-Ding Rampage avatar
Ring-A-Ding Rampage username pic Joined 9y ago
(づ。◕‿‿◕。)づ Ripe Supporter Moderator
Offline
5,366 points Ranked 1282nd
76 medals 11 legendary 20 rare
  • Submitted 60 Sprites Medal icon
  • Thanked 500 submitters Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
  • Submitted 100 Skins Medal icon
  • Reached 100 subscribers Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
CSS

Submitter

Ring-A-Ding Rampage avatar
Ring-A-Ding Rampage username pic Joined 9y ago
(づ。◕‿‿◕。)づ Ripe Supporter Moderator
Coding
5,366 points Ranked 1282nd
76 medals 11 legendary 20 rare
  • Submitted 60 Sprites Medal icon
  • Thanked 500 submitters Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2015 Medal icon
  • Submitted 100 Skins Medal icon
  • Reached 100 subscribers Medal icon
  • 15+ Entries! GameBanana’s Christmas Giveaway 2016 Medal icon
Ring-A-Ding Rampage avatar
Ring-A-Ding Rampage

Creator
Sign up to access this!
Sign up to access this!
Sign up to access this!

Game

Sign up to access this!

Category

Sub-category
UI Themes
Super-category
Cascade Style Sheets

License

Share

  • Share on Reddit
  • Share on Twitter
  • Share on Facebook
  • 6
  • 2.2k
  • 9
  • 5y
  • 2mo
  • 5mo

More from Submitter

More UI Themes Scripts