On android back button press navbar not refreshing active class immediatelyNavbar buttons stay pressedHow to set bootstrap navbar active class with Angular JS?Bootstrap navbar active class drupalBootstrap 3 - Navbar active classwhy bootstrap navbar doesn't set 'active' class?Navbar logout buttonHow to set Bootstrap navbar “active” class in Angular 2?“Active” class not working in Bootstrap NavbarBootstrap 4 navbar active classLogin and Sign up button again showing when page is refreshed or pressed cntrl+shift+R after “logged In” in angular and spring

A simple problem about Rule

Do ibuprofen or paracetamol cause hearing loss?

How are unbalanced coaxial cables used for broadcasting TV signals without any problems?

Are scroll bars dead in 2019?

A medieval fantasy adventurer lights a torch in a 100% pure oxygen room. What happens?

I was promised a work PC but still awaiting approval 3 months later so using my own laptop - Is it fair to ask employer for laptop insurance?

Were Roman public roads build by private companies?

Is there any way to land a rover on the Moon without using any thrusters?

Why is the Digital 0 not 0V in computer systems?

Are Democrats more likely to believe Astrology is a science?

Boat children and army crossing the river puzzle

Is a suit against a University Dorm for changing policies on a whim likely to succeed (USA)?

How do I get rid of distortion in pictures of distant objects photographed with a telephoto lens?

Why did they ever make smaller than full-frame sensors?

Where can I find vomiting people?

How to remove a secondary database from an availability group and rejoin it?

Double it your way

What was redacted in the Yellowhammer report? (Point 15)

What is this unknown executable on my boot volume? Is it Malicious?

Why is my fire extinguisher emptied after one use?

What is a realistic time needed to get a properly trained army?

What explanation do proponents of a Scotland-NI bridge give for it breaking Brexit impasse?

"Literally" Vs "In the true sense of the word"

How can I discourage sharing internal API keys within a company?



On android back button press navbar not refreshing active class immediately


Navbar buttons stay pressedHow to set bootstrap navbar active class with Angular JS?Bootstrap navbar active class drupalBootstrap 3 - Navbar active classwhy bootstrap navbar doesn't set 'active' class?Navbar logout buttonHow to set Bootstrap navbar “active” class in Angular 2?“Active” class not working in Bootstrap NavbarBootstrap 4 navbar active classLogin and Sign up button again showing when page is refreshed or pressed cntrl+shift+R after “logged In” in angular and spring






.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;








1















Webapp using chrome(android) and on pressing back button(android) double items are active and click outside removes old active in navbar.



Tried to add [routerLinkActiveOptions]=" exact: true ". It does not help.



<div class="row navbar-bottom-row"> 
<a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]=" exact: true " class="col navbar-bottom-item">Home</a>
<a routerLink="/myjobs" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/confirm" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/signup" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
</div>









share|improve this question


























  • is this just a web app or are you packaging it in something like cordova?

    – Matthew Trout
    Mar 28 at 10:18











  • No its just webapplication. No mobile app. Using chrome in android.

    – Niru
    Mar 28 at 11:03











  • 'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

    – Matthew Trout
    Mar 28 at 11:08












  • :hover was the issue. But now i lost hover effect on desktop.

    – Niru
    Mar 28 at 11:36

















1















Webapp using chrome(android) and on pressing back button(android) double items are active and click outside removes old active in navbar.



Tried to add [routerLinkActiveOptions]=" exact: true ". It does not help.



<div class="row navbar-bottom-row"> 
<a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]=" exact: true " class="col navbar-bottom-item">Home</a>
<a routerLink="/myjobs" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/confirm" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/signup" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
</div>









share|improve this question


























  • is this just a web app or are you packaging it in something like cordova?

    – Matthew Trout
    Mar 28 at 10:18











  • No its just webapplication. No mobile app. Using chrome in android.

    – Niru
    Mar 28 at 11:03











  • 'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

    – Matthew Trout
    Mar 28 at 11:08












  • :hover was the issue. But now i lost hover effect on desktop.

    – Niru
    Mar 28 at 11:36













1












1








1








Webapp using chrome(android) and on pressing back button(android) double items are active and click outside removes old active in navbar.



Tried to add [routerLinkActiveOptions]=" exact: true ". It does not help.



<div class="row navbar-bottom-row"> 
<a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]=" exact: true " class="col navbar-bottom-item">Home</a>
<a routerLink="/myjobs" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/confirm" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/signup" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
</div>









share|improve this question
















Webapp using chrome(android) and on pressing back button(android) double items are active and click outside removes old active in navbar.



Tried to add [routerLinkActiveOptions]=" exact: true ". It does not help.



<div class="row navbar-bottom-row"> 
<a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]=" exact: true " class="col navbar-bottom-item">Home</a>
<a routerLink="/myjobs" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/confirm" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
<a routerLink="/signup" routerLinkActive="active" class="col navbar-bottom-item">Link</a>
</div>






angular twitter-bootstrap navbar






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Mar 28 at 11:07







Niru

















asked Mar 28 at 10:14









NiruNiru

467 bronze badges




467 bronze badges















  • is this just a web app or are you packaging it in something like cordova?

    – Matthew Trout
    Mar 28 at 10:18











  • No its just webapplication. No mobile app. Using chrome in android.

    – Niru
    Mar 28 at 11:03











  • 'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

    – Matthew Trout
    Mar 28 at 11:08












  • :hover was the issue. But now i lost hover effect on desktop.

    – Niru
    Mar 28 at 11:36

















  • is this just a web app or are you packaging it in something like cordova?

    – Matthew Trout
    Mar 28 at 10:18











  • No its just webapplication. No mobile app. Using chrome in android.

    – Niru
    Mar 28 at 11:03











  • 'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

    – Matthew Trout
    Mar 28 at 11:08












  • :hover was the issue. But now i lost hover effect on desktop.

    – Niru
    Mar 28 at 11:36
















is this just a web app or are you packaging it in something like cordova?

– Matthew Trout
Mar 28 at 10:18





is this just a web app or are you packaging it in something like cordova?

– Matthew Trout
Mar 28 at 10:18













No its just webapplication. No mobile app. Using chrome in android.

– Niru
Mar 28 at 11:03





No its just webapplication. No mobile app. Using chrome in android.

– Niru
Mar 28 at 11:03













'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

– Matthew Trout
Mar 28 at 11:08






'click outside removes old active in navbar' - Are you sure that it's not just the :focus or :active style that is misleading you?

– Matthew Trout
Mar 28 at 11:08














:hover was the issue. But now i lost hover effect on desktop.

– Niru
Mar 28 at 11:36





:hover was the issue. But now i lost hover effect on desktop.

– Niru
Mar 28 at 11:36












1 Answer
1






active

oldest

votes


















1
















Touch screen needs no hover, so i apply hover only to mouse devices by media query like this.



@media (pointer: fine) 
.navbar-bottom-item:hover
background-color: #000;
color: #fff;







share|improve this answer
























    Your Answer






    StackExchange.ifUsing("editor", function ()
    StackExchange.using("externalEditor", function ()
    StackExchange.using("snippets", function ()
    StackExchange.snippets.init();
    );
    );
    , "code-snippets");

    StackExchange.ready(function()
    var channelOptions =
    tags: "".split(" "),
    id: "1"
    ;
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function()
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled)
    StackExchange.using("snippets", function()
    createEditor();
    );

    else
    createEditor();

    );

    function createEditor()
    StackExchange.prepareEditor(
    heartbeatType: 'answer',
    autoActivateHeartbeat: false,
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader:
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/4.0/"u003ecc by-sa 4.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    ,
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    );



    );














    draft saved

    draft discarded
















    StackExchange.ready(
    function ()
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55395024%2fon-android-back-button-press-navbar-not-refreshing-active-class-immediately%23new-answer', 'question_page');

    );

    Post as a guest















    Required, but never shown

























    1 Answer
    1






    active

    oldest

    votes








    1 Answer
    1






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes









    1
















    Touch screen needs no hover, so i apply hover only to mouse devices by media query like this.



    @media (pointer: fine) 
    .navbar-bottom-item:hover
    background-color: #000;
    color: #fff;







    share|improve this answer





























      1
















      Touch screen needs no hover, so i apply hover only to mouse devices by media query like this.



      @media (pointer: fine) 
      .navbar-bottom-item:hover
      background-color: #000;
      color: #fff;







      share|improve this answer



























        1














        1










        1









        Touch screen needs no hover, so i apply hover only to mouse devices by media query like this.



        @media (pointer: fine) 
        .navbar-bottom-item:hover
        background-color: #000;
        color: #fff;







        share|improve this answer













        Touch screen needs no hover, so i apply hover only to mouse devices by media query like this.



        @media (pointer: fine) 
        .navbar-bottom-item:hover
        background-color: #000;
        color: #fff;








        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Mar 28 at 12:06









        NiruNiru

        467 bronze badges




        467 bronze badges





















            Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.







            Got a question that you can’t ask on public Stack Overflow? Learn more about sharing private information with Stack Overflow for Teams.




















            draft saved

            draft discarded















































            Thanks for contributing an answer to Stack Overflow!


            • Please be sure to answer the question. Provide details and share your research!

            But avoid


            • Asking for help, clarification, or responding to other answers.

            • Making statements based on opinion; back them up with references or personal experience.

            To learn more, see our tips on writing great answers.




            draft saved


            draft discarded














            StackExchange.ready(
            function ()
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55395024%2fon-android-back-button-press-navbar-not-refreshing-active-class-immediately%23new-answer', 'question_page');

            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            SQL error code 1064 with creating Laravel foreign keysForeign key constraints: When to use ON UPDATE and ON DELETEDropping column with foreign key Laravel error: General error: 1025 Error on renameLaravel SQL Can't create tableLaravel Migration foreign key errorLaravel php artisan migrate:refresh giving a syntax errorSQLSTATE[42S01]: Base table or view already exists or Base table or view already exists: 1050 Tableerror in migrating laravel file to xampp serverSyntax error or access violation: 1064:syntax to use near 'unsigned not null, modelName varchar(191) not null, title varchar(191) not nLaravel cannot create new table field in mysqlLaravel 5.7:Last migration creates table but is not registered in the migration table

            용인 삼성생명 블루밍스 목차 통계 역대 감독 선수단 응원단 경기장 같이 보기 외부 링크 둘러보기 메뉴samsungblueminx.comeh선수 명단용인 삼성생명 블루밍스용인 삼성생명 블루밍스ehsamsungblueminx.comeheheheh

            155 수학 과학 기타 둘러보기 메뉴eh추가해eh문서를 완성해