Color Changes with a Drop-Down Menu Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

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.
3 posters

    Color Changes with a Drop-Down Menu

    avatar
    RazielBach
    Forumember


    Posts : 25
    Reputation : 1
    Language : English

    Solved Color Changes with a Drop-Down Menu

    Post by RazielBach August 14th 2014, 12:24 am

    Hey there, and thanks ahead of time for the help.

    Today I implemented a drop-down menu on my forum through template editing. By doing so I had to make all new links to have it replace my old nav bar. However, now that I don't have the old nav-bar I can't actually see if I have new messages. 

    I was wondering if it's possible to make the "Mailbox" text change colors if I have a new message, or have it display a number next to it. I've been trying to figure it out for a bit now, but my coding isn't the greatest right now so it's a little hard for me. 

    My forum is: Here

    Here is the template code:

    Code:
    <ul class="topnav">
          <li><a href="/">Home</a></li>
        <li>     
          <a href="#">Server Information</a>
            <ul class="subnav">
                <li><a href="/">Server Files</a></li>
                <li><a href="/t1-server-rules">Server Rules</a></li>
                <li><a href="/t2-forum-rules">Forum Rules</a></li>
                <li><a href="/t9-forum-information-compendium">Forum Information Compendium</a></li>
                <li><a href="/t13-regarding-the-reporting-of-players">Reporting Players</a></li>
                <li><a href="/t3-important-regarding-bugs">Reporting Bugs</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Useful Resources</a>
            <ul class="subnav">
                <li><a target="_blank" href="http://www.eqemulator.org/">EQEmulator Website</a></li>
                <li><a href="/h1-timezone-clocks">Timezone Clocks</a></li>
            </ul>
        <li>
            <a href="#">Miscellaneous</a>
            <ul class="subnav">
                <li><a href="/faq">FAQ</a></li>
                <li><a href="/memberlist">Forum Members</a></li>
                <li><a href="/calendar">Calendar</a></li>
                <li><a href="/search">Advanced Search</a></li>
            </ul>
        </li>
    <!-- BEGIN switch_user_logged_in -->
        <li><a href="/groups">Groups</a></li>
        <li><a href="/profile?mode=editprofile">Profile</a></li>
        <li><a href="/privmsg?folder=inbox" class="p-m">Mailbox</a></li>
        <li><a href="/login?logout">Logout</a></li>
    <!-- END switch_user_logged_in -->
    <!-- BEGIN switch_user_logged_out -->
        <li><a href="/register">Register</a></li>
      <li><a href="/login">Login</a></li>
    <!-- END switch_user_logged_out -->
    </ul>
    avatar
    RazielBach
    Forumember


    Posts : 25
    Reputation : 1
    Language : English

    Solved Re: Color Changes with a Drop-Down Menu

    Post by RazielBach August 15th 2014, 3:39 am

    Bump. Still haven't figured it out. I'm out of ideas. I need help from those who are more coding savvy than I.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Color Changes with a Drop-Down Menu

    Post by Ange Tuteur August 15th 2014, 7:55 am

    Hi RazielBach,

    Do you still have the original navbar on the forum ? If not add it back, but hide it. Doing so should allow you to check that navbar and modify your new nav. If you don't know what to do let me know. Smile
    avatar
    RazielBach
    Forumember


    Posts : 25
    Reputation : 1
    Language : English

    Solved Re: Color Changes with a Drop-Down Menu

    Post by RazielBach August 15th 2014, 8:29 am

    I don't have the old navbar anymore, it was completely removed from the forums template in favor of the one in the first post. 

    Is it possible to change the color with the new template itself instead of adding in/using the old navbar with it?
    TheCrow
    TheCrow
    Manager
    Manager


    Male Posts : 6916
    Reputation : 795
    Language : Greek, English

    Solved Re: Color Changes with a Drop-Down Menu

    Post by TheCrow August 15th 2014, 10:14 am

    RazielBach wrote:I don't have the old navbar anymore, it was completely removed from the forums template in favor of the one in the first post. 

    Is it possible to change the color with the new template itself instead of adding in/using the old navbar with it?

    Hello,

    By adding the old navbar as Agne told you, you will be able to change and modify the new navbar as wanted. It is easier because you will have all the variables and the elements you need to make the new navbar the way you want it to be.

    MrMind
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Color Changes with a Drop-Down Menu

    Post by Ange Tuteur August 15th 2014, 8:02 pm

    Add this into your overall_header :
    Code:
    <div id="theNav" style="display:none;">{GENERATED_NAV_BAR}</div>

    It wont display, it will simply be used to get some information which otherwise would be more difficult without.
    avatar
    RazielBach
    Forumember


    Posts : 25
    Reputation : 1
    Language : English

    Solved Re: Color Changes with a Drop-Down Menu

    Post by RazielBach August 15th 2014, 8:10 pm

    I've added back the original navbar, and I've added the code to hide it, but I'm not quite sure how that helps me in my situation? My new NavBar is entirely there, links and all through the Template. The old navbar is not, and as such I cannot take any information from that to incorporate into my new one. 

    Maybe I'm not understanding what you said or something, but this got me nowhere atm.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Color Changes with a Drop-Down Menu

    Post by Ange Tuteur August 15th 2014, 8:13 pm

    style="display:none;" hides the navbar, it does not remove it from the document. Since it isn't removed, only hidden, we should be able to check the default navbar for when new messages are present. I'll just need to write a small script to check.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Color Changes with a Drop-Down Menu

    Post by Ange Tuteur August 15th 2014, 8:40 pm

    Here, see if this works :
    Administration Panel > Modules > JavaScript Codes Management > Create a new script

    Title : your choice
    Placement : in all the pages
    Paste the code below and submit :
    Code:
    $(function() {
      var color = '#F00',
      text = 'New message';
      if ($('#theNav:has(.new-message)').length) $('.p-m').css('color',color).text(text);
    });

    You can modify the variable color with the color you want the Messages to be when there are new messages. text is the text displayed on a new message. You just have to make sure it works, if not I'll fix it.
    avatar
    RazielBach
    Forumember


    Posts : 25
    Reputation : 1
    Language : English

    Solved Re: Color Changes with a Drop-Down Menu

    Post by RazielBach August 15th 2014, 8:44 pm

    Great! That worked perfectly. Thank you very much!
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Color Changes with a Drop-Down Menu

    Post by Ange Tuteur August 15th 2014, 8:47 pm

    You're welcome

    Topic archived

    Have a good day. ^^