Denis Stephanov
Denis Stephanov

Reputation: 5231

Disable showing links of <a> element on hover

When I hover over on any website's a element, I get a link in left bottom corner. For example, when I move cursor on Stackoverflow's logo I get Stackoverflow's URL in corner:

enter image description here

Is it possible to disable this URL in the corner using css / html? I am using Angular 5 in project so if there is an Angular feature that does, please let me know. Thanks for answers.

Upvotes: 3

Views: 2208

Answers (3)

Anshuman Jaiswal
Anshuman Jaiswal

Reputation: 5462

You can use button with attribute routerLink, it will not display the URL on hover. It could be written as:

<button [routerLink]="['/register']">Sign Up</button>

Upvotes: 2

Ingo B&#252;rk
Ingo B&#252;rk

Reputation: 20033

Since it's about angular, you can just do this instead:

<button (click)="routeToOtherPage()">Link</button>

with

routeToOtherPage() {
  this.router.navigate(["/other-page"]);
}

You can also write your own directive to inline this, something along the lines of this:

@Directive({
  selector: "[clickRouterLink]"
})
export class ClickRouterLinkDirective {
  @Input()
  private clickRouterLink: any | any[];

  @HostListener("click")
  public handleLinkClicked() {
    // Crude check for whether an array has been provided.
    // You might want to make this better (or even compare with the implementation of routerLink).
    const route = this.clickRouterLink && typeof this.clickRouterLink.length === "number"
      ? this.clickRouterLink
      : [this.clickRouterLink];

    this.router.navigate(route);
  }

  constructor(private router: Router) {}
}

And then

<button clickRouterLink="events">Link</button>
<button [clickRouterLink]="['events', event.id]">Link</button>

Upvotes: 0

David D.
David D.

Reputation: 567

The preview is rendered by the browser and you can't control it. The only solution would be to use another tag with a similar style and functionality, for example:

<span class="link" onclick="window.open('http://website.com','_blank');">Website</span>

Upvotes: 2

Related Questions