Streaming live at 10am (PST)

Current status of a Navbar link unclickable

#1

Hi guys,

I can’t find information on the forum about this, except a thread from 2017 with no solution.

I simply want to make my “current status navlink” unclickable, now it still acts like on any other page and reload the current page.

How come this is not a standard parameter?

Cheers

Phil


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

1 Like
#2

Hello @Philemon

I’m working on a project right now and I’ve wanted the same thing. The current link to be not clickable.

I’m using little css code

 <style>
    .replace-with-your-nav-link-class.w--current {
       pointer-events: none;
  }
</style>

Piter :webflow_heart:

#3

Thanks for the help, but it doesn’t work for me. It just breaks the “current” hover i add (which I’d like to keep), and I can still clic the link and reload.
And also my nav link class has combo class sometimes so I don’t know how to apply it to all.

1 Like
#4

I have a hover effect too for my nav links, but if the current link will be unclickable why having a hover effect?

See the project I’m working on here > https://www.useloom.com/share/68b2387757674a90a19e3fdfc44c82df

Can you share your read-only link?

#5

Because I have sort of dynamic nav bar and I need the hover to come back in place of current state.
will be more clear here : link

#6

Note that the menu won’t work totally on “preview” mode.
Since I use a pageLoad trigger to reset it every time I change page, and seems it doesn’t trigger on preview mode.
I guess full page isn’t reloaded but just content of the preview frame…

1 Like
#7

I can see why the css code is not working for you. You’re using big letters for the class

Should be like the one bellow

.navlink.w--current {
       pointer-events: none; // prevent current link to be clicked
  }

The underline comes back as well

#8

ah thanks!
I thought I was doing it wrong this way. But somehow webflow fixes it at publish right?
Because I used capital letter a lot in my class names and also - and _ … :confused: but still works fine.

1 Like
#9

yep. all the outputted code is lowercase regardless of your class naming convention.

2 Likes
#10

Class names are all lowercase