Using Javascript to change CSS for URL

Question

I have a url in my HTML as seen below. I have made the url inactive

<a style="pointer-events: none; color: rgb(44, 89, 159);" href="https://www.google.com/" id="successfactors">Link</a>

I am trying to reactivate the link via Javascript. I tried the code below, but when I did the page didn't load correctly. Does anyone know what I'm doing wrong or a better way to make a link inactive/active?

document.getElementById('successfactors').style.pointer-events = 'auto';

- is not valid in dot notation, use bracket notation: .style['pointer-events'] = '...' — Andreas Louv
– Andreas Louv, Commented Nov 4, 2014 at 16:05

user1017882 · Accepted Answer · 2014-11-04 16:03:31Z

5

I would recommend you use CSS and javascript in a manner which clearly distinguishes the two.

Define your CSS styles:

.inactive
{
   pointer-events: none;
   color: rgb(44, 89, 159);
}

.active
{
   pointer-events: auto;
}

Toggle the CSS class of the elements with javascript:

document.getElementById("successfactors").className = "inactive";

It's neater and tidier, and I promise you widely-used inline styles eventually cause headaches.

answered Nov 4, 2014 at 16:03

user1017882

Sign up to request clarification or add additional context in comments.

Comments

Scimonster · Accepted Answer · 2014-11-04 16:00:34Z

0

Use:

document.getElementById('successfactors').style.pointerEvents = 'auto';

Styles use camel case, as identifiers can't contain hyphens.

answered Nov 4, 2014 at 16:00

Scimonster

33.4k10 gold badges79 silver badges92 bronze badges

Collectives™ on Stack Overflow

Using Javascript to change CSS for URL

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related